html{overflow-x:hidden;scroll-behavior:smooth;}

body{background:#fff;font-family:'Roboto Condensed', sans-serif;margin:0;padding:0;overflow:hidden}

h1, h2, h3, h4, h5, h6{font-family:'Big Shoulders', sans-serif}

span, p, a, li{font-family:'Roboto Condensed', sans-serif}

h1, h2, h3, h4, h5, h6{margin:0;padding:0}

body a, body p{-webkit-transition:0.5s all;-moz-transition:0.5s all;-o-transition:0.5s all;transition:0.5s all;}

.cl{clear:both}

.container{max-width:1300px}

.top{background:#00b1ff;padding:10px 0;}

.top ul{padding:0;margin:0}

.top li{font-size:0.9em;font-weight:400;margin-bottom:0;text-align:left;display:inline-block;margin-right:15px}

.top a{color:#fff;text-decoration:none}

.top a:hover{color:#28366c;}

.social{text-align:right;}

.social li{display:inline-block;margin-left:5px}

.social li a{color:#fff;text-decoration:none;font-size:1em}

.social li a:hover{color:#28366c;}

.topnav{margin:auto;}

.topnav-in{max-width: 1350px;margin: auto;}

.navbar{background:#fff;padding:0;}

.navbar-dark .navbar-nav .nav-link{color:#777;font-size:0.9em;font-weight:600;text-transform:uppercase;padding:0 25px}

.navbar-dark .navbar-nav .nav-link:focus, .navbar-dark .navbar-nav .nav-link:hover{color:#0f0b55;}

.navbar-dark .navbar-nav .nav-link.act{color:#0f0b55}

.navbar-dark .navbar-nav .nav-item{position:relative;padding:27px 0;}

.navbar-dark .navbar-nav .nav-link::after{content:'';position:absolute;left:0;right:0;bottom:20px;margin:auto;width:27px;height:3px;color:#0f0b55;background:#0f0b55;transform:translateY(5px);-webkit-transition:.3s;-moz-transition:.3s;-ms-transition:.3s;transition:.3s;opacity:0;}

.navbar-dark .navbar-nav .nav-link:hover::after{transform:translateY(0);opacity:1;color:#0f0b55;left: 5%;}

.navbar-dark .navbar-nav .nav-link.act::after{content:'';position:absolute;left:5%;right:0ss;bottom:20px;margin:auto;width:27px;height:3px;color:#0f0b55 !important;background:#0f0b55;transform:translateY(0px);-webkit-transition:.3s;-moz-transition:.3s;-ms-transition:.3s;transition:.3s;opacity:1;}

.nav-auto{margin-left:auto !important;}

.navbar-brand img{width:220px;}

.user-dropdown .dropdown-menu{left:auto;right:0;}

.navbar .menu-large{position:static !important;}

.navbar .megamenu{padding:15px;width:100%;height:auto;margin-top:0;}

.dropdown-item:focus, .dropdown-item:hover{background:transparent;}

.dropdown-header{padding:0;font-size:1.2em;font-weight:600;color:#28366c; margin-bottom:15px}

.dropdown-divider{border-top:1px solid #e6e6e6;}

.megamenu .tab{float:left;width:100%;}

.megamenu .tab button{display:block;background:#00a6e5;color:#fff;padding:15px;width:100%;border:0;outline:none;text-align:left;cursor:pointer;font-size:1em;margin-bottom:10px;font-weight:600}

.megamenu .tab button:hover{background:#28366c;}

.megamenu .tab button.active{background:#28366c;position:relative}

.megamenu .tab button.active::before{content:'';position:absolute;border:10px solid transparent;border-top:0;border-bottom-color:#28366c;position:absolute;right:-14px;top:42%;rotate:90deg;}

.megamenu .tabcontent{float:left;padding:0px 12px;width:100%;border-left:none;display:none;}

.megamenu .clearfix::after{content:"";clear:both;display:table;}

.navbar-nav li:hover > ul.dropdown-menu{display:block;}

.menutab ul{margin-left:-25px}

.menutab li a{font-size:0.9em;font-weight:400;margin-bottom:10px;color:#777;text-decoration:none}

.menutab li a:hover{color:#28366c;letter-spacing:0.2px}

.logo{display:none}

.menutab img{border-radius:5px; height:280px;float:right}

.action{text-align:center;padding:10px 25px;font-weight:300;background:#021456;color:#fff;border:1px solid#021456;font-size:1em;border-radius:0;-webkit-transition:0.5s all;-moz-transition:0.5s all;-o-transition:0.5s all;transition:0.5s all;margin-top:14px;}

.action:hover{background:#00a6e5;border:1px solid#00a6e5;color:#fff;}



.header{padding:0}

.header img{width:100%}

.one-side{margin-top:-400px;position:absolute;z-index:999}

.one-side-text{background:#021456;padding:50px 70px;width:500px}

.one-side-text h2{background:#00a6e5;color:#fff;font-size:1.5em;font-weight:800;line-height:1;display:table;padding:5px 10px;margin-bottom:10px;}

.one-side-text h3{color:#fff;font-size:2.5em;font-weight:800;line-height:1.3;margin-bottom:20px}

.one-side-text p, .one-side-text a{color:#fff;font-size:0.9em;font-weight:400;line-height:1.5;text-decoration:none;}

.one-side-text a{text-align:right;float:right;}

.one-side-text a:hover{color:#00a6e5}



.quality{margin-top:150px}

.quality h3{color:#28366c;font-size:1.3em;font-weight:600;line-height:1.3;margin-bottom:5px;text-transform:uppercase}

.quality p{font-size:0.9em;font-weight:400;margin-bottom:10px;color:#777;}

.grid{display: grid; grid-template-columns:5% 28% 5% 28% 5% 28%; grid-gap: 10px;}

.grid-item{padding:0;}

.pdr-25{padding-right:25px}



.intro{margin-top:100px}

.intro-bg{background:url(../images/intro-bg.png)top left no-repeat;padding:80px}

.intro-bg h3{color:#00b1ff;font-size:2.5em;font-weight:800;line-height:1.3;margin-bottom:20px;padding-right: 150px;}

.intro-bg p{color:#777;font-size:0.9em;font-weight:400;line-height:1.5;text-decoration:none;}

.trust{background:#00b1ff;width:150px;height:150px;position:absolute;padding: 25px 0;top:35%;left:-50px}

.trust img{width:50px;margin:auto;display:block}

.trust h6{color:#fff;font-size:1.5em;font-weight:600;line-height:0;margin:10px 0;text-align:center}



.our-product{margin-top: 100px;}

.our-product-bg{background:url(../images/intro-bg.png)top left no-repeat;}

.our-product h3{color:#00b1ff;font-size:2.5em;font-weight:800;line-height:1.3;margin-bottom:20px;padding:80px 0 0 70px;}

.our-product p{color:#777;font-size:0.9em;font-weight:400;line-height:1.5;text-decoration:none;padding:0 0 0 70px;}

.pro-box1{position: relative;border:1px solid #eeeded}

.pro-box1 img{width: 70%;margin:auto;display:block }

.pro-hover{position: absolute;width: 100%;height: 100%;background:rgba(0,177,255,0.5);top: 0;left: 0;padding: 20px;text-align: center;opacity: 0;-webkit-transition:0.5s all;-moz-transition:0.5s all;-o-transition:0.5s all;transition:0.5s all;cursor: pointer;}

.pro-hover p{color:#fff;font-size:1.4em;font-weight:400;line-height:1.2;text-decoration:none;padding:40px 70px 0 0;text-align: left !important;}

.pro-hover .fa{color: #fff;font-size: 2em;margin-top: 110px}

.pro-box1:hover .pro-hover{opacity: 1;}

.our-product .col-lg-4{margin-bottom: 30px;}



.testimonial{margin-top:100px;padding: 0;position: relative;}

.testimonial h4{color:#fff;font-size:2em;font-weight:800;line-height:1.3;margin-bottom:20px;text-align: center;}

.testimonial-bg{background: url(../images/testimonial.jpg)top left no-repeat; background-size: cover;height: 600px;}

.testimonial-box{position: relative;margin-left: -140px;width: 500px;margin-top: 90px;}

.testimonial .owl-slider{background:url(../images/test-bg.png)top 30px center no-repeat, #021456;padding:100px 20px;}

.test-box{padding-top: 25px;}

.testimonial p{color:#fff;font-size:0.9em;font-weight:400;line-height:1.2;text-align: center;}

.testimonial .owl-nav{display:block;position: absolute;right: -19px;top: 142%;}

.testimonial strong{font-weight:800}

.testimonial .owl-carousel .owl-nav button.owl-next, .testimonial .owl-carousel .owl-nav button.owl-prev{color: #fff;width:30px;height: 30px;background:#00b1ff;font-size: 1.2em;}

.testimonial .owl-carousel .owl-nav button.owl-next{margin-left: 5px;}



.global{margin-top: 100px;padding: 0;}

.global h4{color:#00b1ff;font-size:2.5em;font-weight:800;line-height:1.3;margin-bottom:20px;padding:80px 0 0 70px;}

.global p{color:#777;font-size:0.9em;font-weight:400;line-height:1.5;text-decoration:none;padding:0 0 0 70px;}

.con{display: grid;grid-template-columns: repeat(1, 160px); grid-gap: 200px;padding:30px 0 0 50px;}

.con .box {width: 100%;width: 230px;}

.con .box h2 {display: block;text-align: center;color: #021456;font-size: 1.2em;margin-top: 10px;}

.con .box .chart {position: relative;width: 100%;height: 100%;text-align: center;font-size: 40px;line-height: 230px;height: 230px;width: 230px;   color: #777;}

.con .box canvas {position: absolute;top: 0;left: 0;width: 100%;width: 100%;}



.bottom-strip{background: #021456;margin-top: 100px; padding: 25px 0;}

.bottom-strip img{width: 220px;filter: brightness(0) invert(1);}



.social2{text-align:right;}

.social2 li{display:inline-block;margin-left:5px;width: 45px;height:45px;border: 1px solid#fff;text-align: center;padding:9px;}

.social2 li a{color:#fff;text-decoration:none;font-size:1em}

.social2 li:hover a, .social2 li:hover{color:#021456;background: #00a6e5;border: 1px solid#00a6e5;cursor: pointer;}



.action2{text-align:center;padding:10px 50px;font-weight:300;background:#00a6e5;color:#fff;border:1px solid#00a6e5;font-size:1em;border-radius:0;-webkit-transition:0.5s all;-moz-transition:0.5s all;-o-transition:0.5s all;transition:0.5s all;float: right;}

.action2:hover{background:#fff;border:1px solid#fff;color:#021456;}



.footer{background: #eff2fd;padding: 50px 0;}

.footer h3{color:#021456;font-size:1.5em;font-weight:600;line-height: 1;margin-bottom: 25px;}

.footer .list ul{list-style:none; margin:0;padding:0}

.footer .list li{color:#656464; font-size:0.9em; font-weight:400; margin-bottom:10px}

.footer .list a{color:#656464; text-decoration:none}

.footer .list a:hover{color:#021456; text-decoration:none;letter-spacing: 2;}

.footer-line{border-top: 1px solid #dde3f8;}

.address{background: #00a6e5;padding:20px;}

.address p{font-size:0.9em;font-weight:400;color:#fff}

.address a{text-decoration:none; color:#fff !important}

.copyright{margin-top:25px}

.copyright p, .copyright a{text-align:center; color:#656464;font-size:1em;font-weight:300}

.copyright a:hover{color:#ff5c00;margin-left:0px}



.top-scroll{display:none;position:fixed;bottom:50px;right:4%;z-index:1000;display:block;width:40px;height:40px;line-height:35px;font-size:23px;color:#fff;text-align:center;background:#00a6e5;border-radius:25px;cursor:pointer;-webkit-transform:translateZ(0);-moz-transform:translateZ(0);transform:translateZ(0);opacity:1;}

.top-scroll:hover{opacity:1;}



.inner-header{background: #021456;padding:20px;}

.inner-header h1 {color: #fff;font-size:1.8em;font-weight: 400;line-height: 1.3;margin-bottom: 0;text-align: center;}



.page-wrap{margin-top: 50px;}

.page-wrap h2{font-size:2em;color:#282828;font-weight:800;margin-bottom:10px}

.page-wrap h3{font-size:2em;color:#282828;font-weight:800;margin-bottom:10px;margin-top:15px}

.page-wrap h4{font-size:2em;color:#282828;font-weight:800;margin-bottom:10px;margin-top:15px}

.page-wrap h5{font-size:1.3em;color:#282828;font-weight:800;margin-bottom:10px;margin-top:10px}

.page-wrap p{font-size: 0.9em;font-weight: 400;color: #777;line-height: 1.5;text-decoration:none !important;}

.page-wrap strong{font-weight:800;font-size: 1.1em;}

.page-wrap ul{margin-left:-25px}

.page-wrap li{font-size:1.1em;color: #777;font-weight:400;line-height:1.5}

.pro-box{border: 1px solid #e6ecff;padding:15px;background: #fff;box-shadow: 0px 0px 20px #f2f2f2;}

.pro-box .pname{color:#021456;text-decoration:none !important;text-align:center; display:block}

.pro-box .pname:hover{color:#00a6e5;}

.pro-box a{text-decoration:none}

.page-wrap .col-lg-3{margin-bottom:30px}



.product__carousel{display: block;}

.product__carousel a{display: block;margin-bottom: 15px;}

.product__carousel .gallery-top{border: 1px solid #ebebeb;border-radius: 3px;margin-bottom: 5px;}

.product__carousel .gallery-top .swiper-slide {position: relative;overflow: hidden;}

.product__carousel .gallery-top .swiper-slide a{position: relative;display: flex;justify-content:center;align-items:center;width: 100%;height: 100%;}

.product__carousel .gallery-top .swiper-slide a img {width: 100%;height: 100%;object-fit: contain;}

.product__carousel .gallery-top .swiper-slide .easyzoom-flyout img {min-width: 100%;min-height: 100%;}

.product__carousel .swiper-button-next.swiper-button-white, .product__carousel .swiper-button-prev.swiper-button-white {color:#1c64b0;;}

.product__carousel .gallery-thumbs .swiper-slide {position: relative;transition: border .15s linear;border: 1px solid #ebebeb;border-radius: 3px;	cursor: pointer;overflow: hidden; height: calc(100% - 2px);}

.product__carousel .gallery-thumbs .swiper-slide.swiper-slide-thumb-active {border-color: #000;}

.product__carousel .gallery-thumbs .swiper-slide img {position: absolute;left: 50%;top: 50%;transform: translate(-50%,-50%);max-width: 100%;}

.product-details{padding-left:50px}

.product-details h1{font-size:2em;color:#282828;font-weight:600}

.product-details .rating {color:#2c65b0;font-size:1em;padding: 12px 0 0;margin: 0;list-style: none;position: relative;z-index: -1;}

.product-details p{font-size:0.9em;color:#606469; font-weight:300;line-height:1.5; margin:5px 0}

.outstock{color:#f00 !important; font-weight:600 !important}

.instock{color:#3ca203 !important;font-weight:600 !important}

.product-details .price {color: #282828;font-size: 2em;font-weight: 600;letter-spacing: 0.6px;margin-bottom: 8px;transition:all 0.3s;margin-top:25px}

.product-details .price span {color: #999;font-size: 17px;font-weight: 400;text-decoration: line-through;margin-left: 3px;display: inline-block;}

.q-b2b{display:flex;margin-top:25px}

.quantity{margin-top:0}

.quantity .input-number {width: 80px;padding: 0 12px;vertical-align: top;text-align: center;outline: none;}

.quantity .input-number, .input-number-decrement, .input-number-increment {border: 1px solid #2c65b0;height: 40px;user-select: none;}

.input-number-decrement, .input-number-increment {display: inline-block;width: 30px;line-height: 38px;background:#021456;color: #fff;text-align: center;font-weight: bold;cursor: pointer;}

.input-number-decrement:active, .input-number-increment:active {background: #ddd;}

.input-number-decrement {border-right: none;border-radius:0;}

.input-number-increment {border-left: none;border-radius: 0;}

.buy{text-align:center;padding:12px 60px;line-height:1.6;font-weight:400;background:#021456;border:1px solid#021456;color:#fff;font-size:0.9em; border-radius:0px;-webkit-transition:0.5s all;-moz-transition:0.5s all;margin-top:25px;}

.buy:hover{background:#00a6e5;border:1px solid#00a6e5;color:#fff;}



.review{padding:0; margin-top:80px}

.review h2{font-size:2em;color:#282828;font-weight:800;margin-bottom:10px}

.review .nav-tabs li a{font-size:1.5em; color:#282828}

.review .nav-tabs .nav-item .nav-link{font-size:1.2em}

.review .nav-tabs .nav-item.show .nav-link{border-color:transparent;}

.review .nav-tabs .nav-link:focus, .review .nav-tabs .nav-link:hover {border-color:transparent;}

.review .nav-tabs .nav-link.active{border-color: transparent;border-bottom-color: transparent;border-bottom: 3px solid #00a6e5;}

.review .tab-content{padding:25px 0}

.review .tab-content h2{font-size:1.5em; font-weight:600;color:#000; margin-bottom:15px}

.review .tab-content p, .review .tab-content li{font-size:0.9em; font-weight:400;color:#282828;}

.review .tab-content a{font-size:0.9em; font-weight:600;color:#021456;text-decoration:none}

.review .tab-content a:hover{color:#00a6e5}



hr.ric{border-top:1px solid #f4f4f4}



.career-form{background:#eff2fd;padding:70px;width: 800px;margin: auto;margin-top: 50px;}

.career-form p{color:#000;font-size:0.9em;font-weight:400; line-height:1;margin-bottom: 7px;}

.career-form .form-control{height: 45px;border-radius: 0;border: 0;background:#e0e6fc;}

.career label{font-size:0.9em;margin-right:10px}



.contact-in{padding:0px}

.contact-in h4{font-size:1.1em;font-weight:700;color:#181818;text-align:center;line-height:0}

.contact-in p{font-size:1em;font-weight:400;color:#6c6a6a;text-align:center;}

.contact-in img{width:50px;height:50px; margin:auto;display:block}

.f1{background:#fff;border: 1px solid #e4e3e1; padding:30px 50px; border-radius:10px;height: 200px;text-align: center;}

.f1 .fa{font-size: 2em;text-align: center;color:#00a6e5;margin-bottom:10px}

.form-side{background:transparent;padding:0px; margin-top:50px}

.form-side .container{padding:0px}

.form-side h3{font-size:1.8em;font-weight:300;color:#000;line-height:1}

.form-side h4{font-size:1.2em;font-weight:500;color:#000;line-height:2}

.form-side h5{font-size:1.2em;font-weight:300;color:#000;line-height:2}

.form-side h6{font-size:3em;font-weight:800;color:#2f4d5a;text-align:center;text-transform:uppercase}

.form-side p{font-size:1em;font-weight:400;color:#000;line-height:1}

.g1{background:rgba(0,0,0,0.1);padding:0px; border-radius:10px; overflow:hidden;border:1px solid #e5e5e5}



.form-in{background:#f6f6f6;padding:50px;border-radius:10px; border:1px solid #e5e5e5}

.form-in .form-control{height:45px; font-size:0.9em}

.form-in #textarea{width:100%; height:130px; padding: .375rem .75rem; font-size: 1rem; font-weight: 400; line-height: 1.5; color: #495057; background-color: #fff; background-clip: padding-box; border: 1px solid #ced4da; border-radius: .25rem; transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;}



.submit{text-align:center;padding:12px 50px;font-weight:300;background:#021456;color:#fff;border:1px solid#021456;font-size:1em;border-radius:0px;-webkit-transition:0.5s all;-moz-transition:0.5s all;-o-transition:0.5s all;transition:0.5s all;margin-top: 15px;}

.submit:hover{background:#00a6e5;border:1px solid#00a6e5;color:#fff;}



.modal-content{background:#021456;padding: 25px;}

.modal-content .form-control{background: rgb(1, 15, 65);border:0;border-radius: 0;height: 45px;color: #fff;}

.modal-header h4{font-weight: 800;color: #fff;}

.modal-content input::placeholder, .modal-content textarea::placeholder, .modal-content select{color: #fff;font-size: 0.9em;}

.modal-content select.form-control:not([size]):not([multiple]) {height:45px;}

#textarea{display: block;width: 100%;height:100px;padding: 6px 12px;font-size: 14px;line-height: 1.42857143;color: #555;border: 0px;border-radius:0;background:rgb(1, 15, 65);}

.modal-content .close, .close:not(:disabled):not(.disabled):focus, .close:not(:disabled):not(.disabled):hover{color: #fff;text-shadow: none;opacity: 1;}



#dmenu, #hide{display:block;}



@media (min-width: 420px) and (max-width: 659px){

.con {grid-template-columns: repeat(2, 160px);}

}

@media (min-width: 660px) and (max-width: 899px){

.con {grid-template-columns: repeat(3, 160px);}

}

@media (min-width: 900px){

.con {grid-template-columns: repeat(4, 160px);}

}



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

html{overflow-x:hidden;scroll-behavior:smooth;}

}



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

html{overflow-x:hidden;scroll-behavior: smooth;}

.topnav-in, .social{text-align: center;}

.navbar-collapse{background:#00b1ff;position:fixed;left:0px;width: 260px;height: 100%;top:0px;overflow-y:scroll;z-index:9999}

.logo{background:#fff;display:block;padding:5px}

.logo img{width:80px;display:block !important;margin: auto;}

.navbar-brand img {width: 150px;}

.navbar {padding: 5px 0;}

.navbar-dark .navbar-toggler-icon {background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(2, 20, 86)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");}

.navbar-dark .navbar-nav .nav-link {color: #fff;padding: 0;text-align: left;}

.navbar-dark .navbar-nav .nav-item {position: relative;padding:10px 15px;}

.megamenu .tab{display:none}

.menutab .tabcontent{display:block;overflow: hidden;}

.navbar .megamenu {padding: 10px 0;}

.dropdown-header {font-size:0.9em;margin-bottom: 5px;}

.dropdown-header:after{content: '\f0da';font-family: FontAwesome;font-weight: normal;font-style: normal;margin:0px 0px 0px 10px;text-decoration:none;float: right;}  

.menutab li a:hover {color: #28366c;letter-spacing: 0;}

#dmenu{display: none; border-bottom:1px solid#ccc;margin-bottom:10px}

.navbar-dark .navbar-nav .nav-link::after{display:none}

.ml-auto .action{display:none}

.one-side {margin-top: 0;position: relative;padding: 0;}

.one-side .container{padding:0}

.one-side-text {padding:15px 15px 35px 15px;width: 100%;}

.one-side-text h2 {font-size: 1.2em;}

.one-side-text h3 {font-size: 1.5em;margin-bottom: 10px;}

.quality {margin-top: 50px;}

.grid {display: block; text-align:center}

.grid-item {margin-bottom: 10px;}

.pdr-25 {padding-right:0;}

.our-product {margin-top: 50px;}

.our-product h3 {font-size: 1.5em;margin-bottom: 20px;padding: 50px 0 0 10px;}

.our-product p{padding:0 0 0 15px}

.testimonial {margin-top: 20px;}

.testimonial-bg{height:0}

.testimonial-box {margin-left: 0;width: 100%;margin-top: 0;}

.testimonial h4 {font-size: 1.5em;}

.testimonial .owl-slider {background: url(../images/test-bg.png)top 10px center no-repeat, #021456;padding: 70px 20px 30px;}

.testimonial .owl-nav{top:100%}

.bottom-strip {background:#00a6e5;margin-top: 10px;padding: 25px 0;text-align: center;}

.bottom-strip .action2{display:none}

.social2 {text-align: center;margin-top: 15px;}

.social2 ul{padding: 0}

#hide{display:none}

.page-wrap h2, .page-wrap h3, .page-wrap h4, .page-wrap h5{font-size: 1.3em;}

.product-details {padding-left: 15px;}

.product-details h1 {font-size: 1.3em; margin-top:25px}

.product-details .price {font-size: 1.5em;}

hr.ric {border-top: 0px solid #f4f4f4;margin: 0;}

.review .nav-tabs .nav-item .nav-link {font-size: 0.7em;}

.career-form {padding: 25px;width: 100%;}

.f1{padding: 15px;height: auto;margin-bottom: 15px;}

.form-side {margin-top:0;}

.form-in {padding: 25px;margin-bottom:15px}

}



.help-block{ color:red; font-size: 12px; }

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

.navbar-collapse.collapsing{transition:height 0s ease;transition:.1s ease;position:fixed}

.navbar-collapse{transform:translateX(-100%);transition:.1s ease;}

.navbar-collapse.show{transform:translateX(0%);transition:.1s ease;}

}