@import url('https://fonts.googleapis.com/css?family=Poppins:400,600');
@import url('https://fonts.googleapis.com/css?family=Ubuntu&display=swap');
@import url('https://fonts.googleapis.com/css?family=Oswald:400,500&display=swap');
@import 'font-awesome.css';

/* Clear CSS */
.clearfix { }
.clear { clear:both;}
.clearfix:after{ content: "."; display:block; height:0; font-size:0; clear:both; visibility:hidden;}

.hover { transition:all 0.5s ease-in-out 0s; -moz-transition:all 0.5s ease-in-out 0s; -ms-transition:all 0.5s ease-in-out 0s; -webkit-transition:all 0.5s ease-in-out 0s; -o-transition:all 0.5s ease-in-out 0s;}
.hover3 { transition:all 0.3s ease-in-out 0s; -moz-transition:all 0.3s ease-in-out 0s; -ms-transition:all 0.3s ease-in-out 0s; -webkit-transition:all 0.3s ease-in-out 0s; -o-transition:all 0.3s ease-in-out 0s;}

/*-----------------------------Common CSS END-----------------------------*/

body { background:#2f2e2e; font-size:13px; font-family: 'Poppins', sans-serif; font-weight:400; color:#222; word-wrap:break-word; margin:0px; padding:0px; width:100%; height:100%;}

.top-head { background: #c5161d; text-align: center; padding: 8px 0; color: #fff; font-size: 16px; font-weight: 600; text-align: center; font-style: italic;}

.mainmenu-area { position: relative; z-index: 99; top: 0; left: 0; width: 100%;}
.mainmenu-area.stricky-fixed { position: fixed; top: 0; left: 0; width: 100%; z-index: 9999; -webkit-animation-name: menu_sticky; animation-name: menu_sticky; -webkit-animation-duration: 0.60s; animation-duration: 0.60s; -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; }

.nav-previous, .nav-next { margin-top: 15px; font-size: 1em; font-family: "Ubuntu", sans-serif; display: inline-block;}
.nav-previous {float: left;}
.nav-previous a { text-decoration: none;}
.nav-next { float: right;}
.nav-next a {text-decoration: none;}
header { background: #2f2e2e; position: relative;}
header div.topbar { height: 50px; background-color: #000; text-align: right; line-height: 50px;}
header div.topbar a { -webkit-transition: all 200ms ease-in-out; -moz-transition: all 200ms ease-in-out; -ms-transition: all 200ms ease-in-out; -o-transition: all 200ms ease-in-out; transition: all 200ms ease-in-out; color: #5e606e; outline: none; text-decoration: none; font-size: 0.875em;}
header div.topbar a:not(:last-child):not(.last) { margin-right: 25px;}
header > nav { position: relative; height: 100px;}
header > nav > .container { padding: 0; position: relative; z-index: 2;}
header .mobile-nav { display: none; padding: 15px 18px; line-height: 1; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; border-radius: 3px; border: 1px solid rgba(255, 255, 255, 0.2); color: #fff; font-family: "Ubuntu", sans-serif; font-weight: bold; font-size: 0.875em; float: right; margin: 32px 0; cursor: pointer; text-decoration: none; outline: none;}
header > nav > .container > div.logo { position: relative; height: 66px; width: 347px; float: left;}
header > nav > .container > div.logo.bg > a.logo-image { overflow: hidden; position: relative; z-index: 2; background-repeat: no-repeat; background-size: cover; background-position: center; width: 347px; height: 66px; margin: 0 auto; top: 15px; display: block;}

header > nav > .container > ul { display: flex; display: -webkit-flex; align-items: center; -webkit-align-items: center; justify-content: flex-end; -webkit-justify-content: flex-end; position: relative; height: 100px;}
header > nav > .container > ul > li { list-style: none; display: inline-block; -webkit-transition: all 200ms ease-in-out;  -moz-transition: all 200ms ease-in-out; -ms-transition: all 200ms ease-in-out; -o-transition: all 200ms ease-in-out; transition: all 200ms ease-in-out; padding: 12px 20px; position: relative;}
header > nav > .container > ul > li:hover span.title { color: #c5161d;}
header > nav > .container > ul > li > a { text-decoration: none;}
header > nav > .container > ul > li > a > span { display: block; line-height: 1;}
header > nav > .container > ul > li > a > span.title { font-size: 15px; -webkit-transition: all 300ms ease-in-out; -moz-transition: all 300ms ease-in-out; -ms-transition: all 300ms ease-in-out; -o-transition: all 300ms ease-in-out; transition: all 300ms ease-in-out; color: #fff;}
header > nav > .container > ul > li > ul.sub-menu { position: absolute; top: 100%; left: 20px; width: 200px; padding: 15px; background: rgba(0,0,0,1); -webkit-transition: all 200ms ease-in-out;  -moz-transition: all 200ms ease-in-out; -ms-transition: all 200ms ease-in-out; -o-transition: all 200ms ease-in-out; transition: all 200ms ease-in-out; visibility: hidden; opacity: 0; transform: scale(0)}
header > nav > .container > ul > li > ul.sub-menu li { list-style: none;}
header > nav > .container > ul > li > ul.sub-menu li a { color: #fff; font-size: 13px; line-height: 28px;}
header > nav > .container > ul > li > ul.sub-menu li a:hover { color: #c5161d;}
header > nav > .container > ul > li:hover ul.sub-menu { transform: scale(1); visibility: visible; opacity: 1;}

.mo-modal { background-color: rgba(0, 0, 0, 0.6);}
.mo-modal .mo-menu-box { margin-top: 15%; background-color: transparent !important; box-shadow: none; border: 0;}
.mo-modal .mo-menu-box .modal-body { padding-left: 0; padding-right: 0;}
.mo-modal .mo-menu-box .modal-body ul li { text-align: left; margin: 20px 0; color: #c5161d;}
.mo-modal .mo-menu-box .modal-body ul#header_menu_mobile ul.sub-menu { padding: 0 0 0 30px;}
.mo-modal .mo-menu-box .modal-body ul li a { text-transform: uppercase; font-size: 16px; text-decoration: none; font-weight: 600; color: #fff;}
.mo-modal .mo-menu-box .modal-body ul li a:hover { color: #c5161d;}
.mo-modal .mo-menu-box .modal-body ul#header_menu_mobile ul.sub-menu li { margin: 10px 0;}
.mo-modal .mo-menu-box .modal-body ul#header_menu_mobile ul.sub-menu li a { font-size: 13px;}


.fullscreen-bg {position:fixed; top:0; right:0; bottom:0; left:0; overflow:hidden; z-index:-100; background-color:#000}
.fullscreen-bg .black-overlay {position:fixed; top:0; right:0; bottom:0; left:0; overflow:hidden; z-index:1; background:rgba(0,0,0,.2); transition:all ease-out .2s}
.fullscreen-bg__video { position:absolute; top:50%; left:50%; width:auto; height:auto; min-width:100%; min-height:100%; -webkit-transform:translate(-50%,-50%); -ms-transform:translate(-50%,-50%); transform:translate(-50%,-50%)}

section.video-top { padding: 150px 0; text-align: center;}
section.video-top .video-txt { background: rgba(0,0,0,0.6); padding: 30px; }
section.video-top .video-txt p { color: #fff; font-size: 16px; font-family: 'Ubuntu', sans-serif; line-height: 2em; margin: 0 0 15px;}
section.video-top .video-txt a { border: 1px solid #fff; display: inline-block; padding: 0 12px; line-height: 40px; color: #fff; background: transparent;}
section.video-top .video-txt a:hover { background: #fff; color: #111;}

section.btm-bg { background-image: url(../images/btm-bg.jpg); background-repeat: no-repeat; background-position: bottom center; background-attachment: scroll; background-size: cover; text-align: center; padding: 150px 0; position: relative;}
section.btm-bg::before { background: rgba(0,0,0,0.6); width: 100%; height: 100%; position: absolute; top: 0; left: 0; right: 0; display: block; content: "";}
section.btm-bg h2, section.product-bg h2 { font-weight: 600; color: #fff; font-size: 36px; margin: 0 0 15px;}
section.btm-bg p, section.product-bg p { color: #f2f2f2; font-size: 15px; font-family: 'Ubuntu', sans-serif; line-height: 2em;}

section.scroll-bg { background: #c4141c; padding: 50px 0;}
section.scroll-bg .scroll-txt { padding: 50px 0; text-align: center; color: #fff;}
section.scroll-bg .scroll-txt h2 { font-weight: 600;}
section.scroll-bg .scroll-txt p { font-size: 15px; font-family: 'Ubuntu', sans-serif; line-height: 2em;}

section.product-bg { background-color: #000; background-position: center center; background-repeat: no-repeat; padding: 200px 0; text-align: center; color: #fff; position: relative;}
section.product-bg::before { background: rgba(0,0,0,0.6); width: 100%; height: 100%; position: absolute; top: 0; left: 0; right: 0; display: block; content: "";}
section.product-bg a { border: 1px solid #fff; display: inline-block; padding: 0 12px; line-height: 40px; color: #fff; background: transparent;}
section.product-bg a:hover { background: #fff; color: #111;}

section.catalogue-bg { background: #3c3c3c; padding: 30px 0 15px;}
.catalogue-block { position: relative; margin-bottom: 15px;}
.catalogue-block h2 { position: absolute; display: flex; justify-content: center; align-items: center; top: 0; left: 0; right: 0; bottom: 0; color: #fff; font-weight: 600; font-size: 36px; margin: 0;}

section.contact-bg { background: #c4141c url(http://medisys.com.pk/images/contact-bg.jpg) top left no-repeat; padding: 20px 0; color: #fff; width: 100%; min-height: 456px}
.contact-img { display: none;}
.contact-details { text-align: center; flex-direction: column; display: flex; justify-content: center; min-height: 416px;}
.contact-details h2 { font-family: 'Oswald', sans-serif; font-weight: 500; color: #fff; font-size: 40px; line-height: 1.3em; margin: 0;}
.contact-details p { font-size: 14px; font-family: 'Ubuntu', sans-serif; margin: 15px 0 0;}
.contact-details p a { color: #fff;}
.contact-details p a:hover { text-decoration: underline;}
/*
section.contact-bg p { font-size: 15px; font-family: 'Ubuntu', sans-serif; margin: 0 0 15px;}
section.contact-bg p i { background: #2f2e2e; border-radius: 3px; width: 30px; height: 30px; line-height: 30px; text-align: center; font-size: 13px;}
section.contact-bg p a { color: #fff;}
section.contact-bg p a:hover { text-decoration: underline;}font-family: 'Oswald', sans-serif;
*/

section.certificate-bg { background: #e9e9e9 url(../images/sgs-bg.jpg) center center no-repeat; padding: 60px 0; width: 100%;}
.c-block h4 { text-align: center; margin: 15px 0; font-family: 'Oswald', sans-serif; font-weight: 400;}

.content-pages { min-height: 500px;  text-align: center;}
.content-pages h2 { font-weight: 600; color: #fff; font-size: 36px; margin: 15px 0;}
.content-pages p { font-size: 15px; font-family: 'Ubuntu', sans-serif; line-height: 2em; color: #f2f2f2 }

.rd-text { display: grid; justify-content: center; align-content: center; min-height: 350px;}






.cd-top { display:inline-block; height:40px; width:40px; text-align:center; font-size:16px; color:#fff !important; background:#000; line-height:40px; position:fixed; bottom:30px; right:30px; overflow:hidden; visibility:hidden; white-space:nowrap; opacity:0; transition: all 0.5s ease-in-out 0s; z-index:9999; border-radius: 5px;}
.cd-top:hover { background:#111;}
.cd-top.cd-is-visible, .cd-top.cd-fade-out, .no-touch .cd-top:hover { transition: all 0.5s ease-in-out 0s;}
.cd-top.cd-is-visible { visibility:visible; opacity:1; }
.cd-top.cd-fade-out { opacity:0.5; }
.no-touch .cd-top:hover { background:#111; opacity:1; color:#fff; }

footer { background: #2f2e2e; padding: 30px 0; text-align: center; color: #fff; font-family: 'Ubuntu', sans-serif; font-weight: 400;}