@charset "utf-8";
/* CSS Document */

/* Reset CSS
---------------------------------------------------*/

html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video{ margin:0; padding:0; border:0; outline:0; vertical-align:baseline; background:transparent; }
body{ line-height:1; }
article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary{ display:block; }
nav ul{ list-style:none; }
blockquote, q{ quotes:none; }
blockquote:before, blockquote:after, q:before, q:after{ content:''; content:none; }
a{ margin:0; padding:0; font-size:100%; vertical-align:baseline; background:transparent; }
a{ margin:0; padding:0; font-size:100%; vertical-align:baseline; background:transparent; }
ins{ background-color:#ff9; color:#000; text-decoration:none; }
mark{ background-color:#ff9; color:#000; font-style:italic; font-weight:bold; }
del{ text-decoration:line-through; }
abbr[title], dfn[title]{ border-bottom:1px dotted #000; cursor:help; }
table{ border-collapse:collapse; border-spacing:0; }
hr{ display:block; height:1px; border:0; border-top:1px solid #cccccc; margin:1em 0; padding:0; }
input, select{ vertical-align:middle; }
/* End of Reset CSS
---------------------------------------------------*/

/* CSS 3
---------------------------------------------------*/
@font-face{
font-family:'archiveregular';
src:url('fonts/archive-webfont.eot');
src:url('fonts/archive-webfont.eot?#iefix') format('embedded-opentype'),
url('fonts/archive-webfont.woff2') format('woff2'),
url('fonts/archive-webfont.woff') format('woff'),
url('fonts/archive-webfont.ttf') format('truetype'),
url('fonts/archive-webfont.svg#archiveregular') format('svg');
font-weight:normal;
font-style:normal;
}
@font-face {
font-family: "responsivenav";
src:url("fonts/responsivenav.eot");
src:url("fonts/responsivenav.eot?#iefix") format("embedded-opentype"),
url("fonts/responsivenav.ttf") format("truetype"),
url("fonts/responsivenav.woff") format("woff"),
url("fonts/responsivenav.svg#responsivenav") format("svg");
font-weight: normal;
font-style: normal;
}

/* End of CSS 3
---------------------------------------------------*/

/* Standard CSS
---------------------------------------------------*/
body{ background:#ffffff; font-size:13px; color:#7c858f; font-family:'Open Sans', sans-serif; }
blockquote{ font-family:Georgia, "Times New Roman", Times, serif; margin:5px; padding:10px; font-size:1.52em; color:#999; font-style:italic; line-height:1.3em; width:100%; quotes:none; }
blockquote.left{ border-right:1px dashed #ccc; width:35%; }
/* float blockquote left, and set width */
blockquote.right{ border-left:1px dashed #ccc; width:35%; }
/* float blockquote right and set a width */

/***Hyperlinks****/
a{ color:#2d2d2d; text-decoration:none; transition:all .2s ease; -moz-transition:all .2s ease; -webkit-transition:all .2s ease; }
a:hover, a:focus{ text-decoration:none; color:#18b68d; outline:none;}
a:active, a:visited{outline:none; }
p{ font-size:17px; line-height:27px; color:#3d3d3d; font-weight:400; margin-bottom:25px;}
/* ** ** Header Styles ** ** */
h1, h2, h3, h4, h5, h6{color:#525252; font-family:'archiveregular'; font-weight:normal; }
h1{ font-size:85px; color:#fff; line-height:83px; margin-bottom:2%;}
h2{ font-size:32px; line-height36px; color:#fff; margin-bottom:19px; }
h3{ font-size:40px; color:#59b246; line-height:44px; margin-bottom:6px;}
h4{ font-size:30px; color:#59b246; line-height:32px; margin-bottom:12px; }
h5{ font-size:28px; color:#fff; }
h6{ font-size:20px; color:#525252; }
/* ** ** ul li's ** ** */
ul{ list-style:none; }
ul, ol{ margin:0; padding:0; }
li ul, li ol{ padding:0; margin:0; }
*{
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
box-sizing:border-box;
}
img{
max-width:100%;
height:auto;
vertical-align:middle;
border:0;
-ms-interpolation-mode:bicubic;
}
/* Standard CSS Class Name
---------------------------------------------------*/

.resp-tabs-list li span, .ftr_contact li span i, .ftrb_right ul li a, .sldi_cont h5:after, .owl-controls .owl-buttons div, .controls label, .contact_middle ul li span i, .video-js .vjs-big-play-button{ background-image:url("img/main_sprite.svg"); background-repeat:no-repeat;}

.main_con{ width:100%; height:auto; }
.container{ max-width:1140px; margin:0 auto }

#home{ background-image:url("img/header_bg.jpg"); background-position: center top; background-repeat:no-repeat; background-size:cover; position:relative;padding-top:180px;}
#home img{ position:relative; z-index:4; }
#home .top_heading p{ color:#e1e1e1; font-size:22px; line-height:35px; font-weight:300; margin-bottom:45px;}
#home:after{ position:absolute; content:''; width:100%; height:170px; background-color:#2f2f2f; display:block; left:0; bottom:0;}

.video_top{ position:absolute; top:42px; left:50%; margin-left:-408px;z-index:5; -webkit-border-radius:1px; -moz-border-radius:1px; border-radius:1px; overflow:hidden;}
.tab_section{ position:relative;}
.mob_tabsec{ display:none;}

#services{ background-color:#2f2f2f; background-image:url("img/service_bg.png"); background-position:center bottom; background-repeat:no-repeat; overflow:hidden; padding-top:25px;}

.sldr_hover{display:none; position:absolute; bottom:106px; /*padding:40px 5%;*/}
.sldr_hover p{ color:#ffffff; margin:35px 0 0 0; font-weight:300;}
#sync2 .owl-wrapper-outer{ overflow:visible;}
.sldi_cont{ position:absolute; top:0; left:0; width:100%; height:100%; background-color:rgba(0,0,0,.5);}
#sync2{ padding:0 50px;}
.sld_image img{ max-width:none;}
.sldi_cont h5{ position:absolute; top:0; left:0; width:100%; padding:0 4%; top:50%; text-align:left; transform: translateY(-50%); line-height:normal; -moz-transform: translateY(-50%); -webkit-transform: translateY(-50%); padding-top:10px;}
.sldi_cont h5 span{ width:84%; white-space:nowrap; text-overflow:ellipsis; overflow:hidden; display:inline-block;}
.sldi_cont h5:after{ position:absolute; width:37px; height:37px; border:2px solid #fff; -webkit-border-radius:100%; -moz-border-radius:100%; border-radius:100%; content:""; display:inline-block; right: 15px;top: 7px; background-position: 13px -1113px;}
section { text-align:center;
width: 100%;
}
#sync1 .owl-item .item{ padding:0 5% 100px;}
.item:hover .sldr_hover{ display:block; width:100%; background-color:#51a53f;}

#partners{ padding:75px 0px; float:left;}
.tab_rept { width:100%; }
.tab_rept ul li{ float:left; width:25%;}
.tab_rept ul li span{ display:block; padding:60px 10px; background:#f6f6f6; border:2px solid transparent; margin:5px;}

.tab_rept ul li span img{ -webkit-filter: grayscale(1);
              -webkit-filter: grayscale(100%);
              filter: grayscale(100%);
            filter: gray; opacity:.8; }
.tab_rept ul li:hover span img{ -webkit-filter: grayscale(0);
-webkit-filter: grayscale(0%);
filter: grayscale(0%);
filter: none;opacity:1;}
.tab_rept ul li:hover span{ background-color:#fff; border-color:#59b246; transition:all .5s ease; -moz-transition:all .5s ease; -webkit-transition:all .5s ease;}



#work{ background-color:#1c1c1c; padding:80px 0 0 0; display:inline-block;}

#work .top_heading{ margin-bottom:70px;}
#work .top_heading h3{ color:#ffffff;}
#work .top_heading p{ color:#575757;}
.main_port{display: -webkit-flex;display: flex;}
.port_rept{ width:50%; float:left; position:relative; overflow:hidden;}
.bg_yellow{background-color:#eed276;}
.bg_purple{background-color:#eed276;}
.bg_blue{background-color:#eed276;}
.bg_lblue{background-color:#eed276;}
.port_rept p{ margin-bottom:0;}
.port_cont{ background-color:#fff; text-align:left; padding:40px 4%; position:absolute; width:100%; bottom:-100%;transition:all .5s ease; -moz-transition:all .5s ease; -webkit-transition:all .5s ease;}
.port_rept:hover img {
opacity: 1;
transform: translateY(-60px);
-webkit-transform: translateY(-60px);
-moz-transform: translateY(-60px);
-ms-transform: translateY(-60px);
-o-transform: translateY(-60px);
}
.port_rept:hover .port_cont{ bottom:0;}
.port_rept img {
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
}

#pricing{padding:75px 0px;}
.main_price{display: -webkit-flex;display: flex; margin-top:80px;}
.price_rept{ width:462px; margin:0 auto; text-align:center; padding:40px 39px 80px; position:relative}

.price_rept:after{ position:absolute; left:0; top:0; width:100%; height:109px; content:''; display:block}
.price_rept.bg_green:after{ background-color:#5aad49;}
.price_rept.bg_black:after{ background-color:#2f2f2f;}
.bg_green{ background-color:#51a53f;}
.bg_black{ background-color:#2b2b2b;}
.price_rept > span{  width:65px; height:65px; -webkit-border-radius:100%; -moz-border-radius:100%; border-radius:100%; display:inline-block; font-size:29px; color:#e6eaec; box-shadow:0 8px 0 0 rgba(0,0,0,.3); line-height:61px; position:absolute; top:0; left:0; margin-top:-30px; left:50%; margin-left:-30px; z-index:4;}
.price_rept.bg_green > span{background-color:#51a53f;}
.price_rept.bg_black > span{background-color:#2b2b2b;}
.price_top{ position:relative; z-index:2;}
.price_top > span{ display:block; margin:18px 0px 40px;}
.price_top > strong{ display:inline-block; margin:10px 0px 58px; font-size:97px; color:#fff; font-weight:300;}
.price_top > strong sup{ display: block; text-align:right; color:#1c1c1c; font-size:18px; font-weight:400; margin-right:11px;}

.price_top > strong sub{ color:#e6eaec; font-size:35px;font-family:'archiveregular';display: inline-block;
vertical-align: top;
margin-top: 17px;}
.bg_black .price_top > strong sup{ color:#51a53f;}
.price_cont ul li{ font-size:18px; line-height:26px; color:rgba(255,255,255,.5); font-weight:300; margin-top:15px;}

.footer{ text-align:center;}
.footer_top{ background-image:url("img/ftr_bg.jpg"); background-position:center bottom; background-repeat:no-repeat; background-color:#1c1c1c;}
.ftr_inner{ background-color:rgba(37,37,37,.85); padding:60px 0 30px;
background-image:url("img/ftr_left.png"),url("img/ftr_right.png"); background-position:left bottom, right bottom; background-repeat:no-repeat; background-size:100%;
}
.footer_bottom{ background-color:#101010; float:left; width:100%; padding-top:20px;}
.footer_bottom p{ margin-bottom:15px;}
.ftr_contact li{ display:inline-block; margin:10px 23px;}
.ftr_contact li strong, .ftr_contact li a{ color:#555555; font-size:15px; font-weight:600;display:table-cell;vertical-align:middle;}
.ftr_contact li span i{ width:62px; height:62px; display:inline-block; border:2px solid #59b246; -webkit-border-radius:100%; -moz-border-radius:100%; border-radius:100%; background-color:#1c1c1c;}

.ftr_contact li.ftr_add span i{ background-position:22px -1469px;}
.ftr_contact li.ftr_tel span i{ background-position:23px -1613px;}
.ftr_contact li.ftr_mail span i{ background-position:21px -1690px;}
.ftr_contact{ margin:40px 0px;}
.ftr_contact li span{ display:table-cell; vertical-align:middle; padding-right:18px;}
.ftr_contact li a:hover{ color:#fff;}
.ftr_menu li{ display:inline-block; margin:5px 28px;}
.ftr_menu li a{ text-transform:uppercase; color:#515151; font-size:13px; font-weight:600;}
.ftr_menu li a:hover{ color:#fff;}
.top_heading > a{ margin-bottom:33px; display:inline-block;}
.footer_top .top_heading p{ color:#545454; padding:0 10%; font-size:16px; line-height:30px;}
.ftrb_left{ text-align:left; float:left;}
.ftrb_left a{ color:#555555;}
.ftrb_left a:hover{ color:#fff;}
.ftrb_left p{ color:#555555; font-size:14px; font-weight:400;}
.ftrb_right{ float:right;}
.ftrb_right ul li{ display:inline-block; margin:4px 12px;}
.ftrb_right ul li a{ width:22px; height:18px; display:block; opacity:.3; transition:none;}
.ftrb_right ul li a:hover{ opacity:1;}
.ftrb_right ul li:last-child{ margin-right:0;}
.ftrb_right ul li.ftr_fb a{ background-position:5px -1194px;}
.ftrb_right ul li.ftr_tw a{ background-position:0px -1267px;}
.ftrb_right ul li.ftr_gp a{ background-position:1px -1341px;}
.ftrb_right ul li.ftr_ld a{ background-position:0px -1413px;}

.ftrb_right ul li.ftr_fb a:hover{ background-position:4px -1785px;}
.ftrb_right ul li.ftr_tw a:hover{ background-position:-1px -1858px;}
.ftrb_right ul li.ftr_gp a:hover{ background-position:0px -1932px;}
.ftrb_right ul li.ftr_ld a:hover{ background-position:0px -1556px}




/*contact form*/
.main_contact{ width:100%;}
.inner_contact{ display:flex; display: -webkit-flex; background-color:#fff;}
.contact_left{ background-color:#59b246; width:680px;order: 0;-webkit-order: 0;}
.contact_right{ width:100%;order: 2;-webkit-order: 2; padding:60px 40px 35px; width:100%;}
.contact_bottom{ background-color:#4fa33d; padding:20px 20px 14px; display:inline-block; width:100%;}
.contact_bottom .ftrb_right{ width:100%; text-align:center;}
.contact_middle{ padding:40px 20px;}
.contact_middle > h6{ font-size:28px; color:#ffffff; margin-bottom:20px;}
.contact_middle ul li h5{ font-size:15px;font-family:'Open Sans', sans-serif; text-transform:uppercase; font-weight:700; margin-bottom:5px;}
.contact_middle ul li{ display:table; width:100%; margin-top:35px;}
.contact_middle ul li span{ display:table-cell; padding-right:12px; vertical-align:top;width:28px;}
.contact_middle ul li .rt_cont{ display:table-cell; text-align:left;}
.contact_middle ul li span i{ width:28px; height:28px; display:inline-block; background-color:#2b2b2b; -webkit-border-radius:100%; -moz-border-radius:100%; border-radius:100%;}
.contact_middle ul li p{ margin-bottom:0;}
.contact_middle ul li p strong{ display:block; font-size:19px; color:#385b30;    font-family: 'archiveregular'; font-weight:normal;}
.contact_middle ul li p, .contact_middle ul li a{ font-size:17px; line-height:22px;}
.contact_middle ul li a:hover{ color:#fff;}
.contact_heading h3{ margin-bottom:0;}
.control_group{ position:relative; float:left; width:100%; margin-bottom:40px;}
.control_group .controls span{ text-transform:uppercase; color:#231f20; font-size:14px; font-weight:700; display:block; margin-bottom:20px;}
.input_box{ background-color:#fff; border:solid #e5e5e5; border-width:0 0 1px 0px; font-size:15px; color:#9c9c9f; font-family: 'Open Sans', sans-serif; width:100%; padding:2px 40px 10px 0px;}
.input_box:focus{ outline:none;}
.control_group .controls{ width:100%; float:left;}
.control_group.wd_50 .controls{ width:48%; position:relative;}
.control_group.wd_50 .controls:last-child{ float:right;}
textarea.input_box{ height:70px; resize:none;}
.btn_black{ -webkit-border-radius:27px; -moz-border-radius:27px; border-radius:27px; background-color:#1c1c1c; padding:18px 49px 16px; text-transform:uppercase; color:#fff; border:none;font-family: 'Open Sans', sans-serif; font-weight:700; font-size:16px; float:right; cursor:pointer;}
.btn_black:hover{ background-color:#59b246;}
.contact_heading{ margin-bottom:25px; display:inline-block; width:100%;}
.control_group:last-child{ margin-bottom:0;}
.parsley-errors-list{ position:absolute; bottom:-21px;}
.parsley-errors-list li{ color:#c0392b; font-size:13px;}
.controls label{ width:18px; height:19px; display:block; position:absolute; top:40px; right:0;}
.controls label.con_name{ background-position:5px -2360px;}
.controls label.con_phone{ background-position:5px -2435px;}
.controls label.con_email{ background-position:0px -2506px;}
.controls label.con_msg{ background-position:0 -2583px;}
.contact_middle ul li span i.cnt_map{ background-position:9px -2654px;}
.contact_middle ul li span i.cnt_tel{ background-position:8px -2728px;}
.contact_middle ul li span i.cnt_mail{ background-position:7px -2799px;}
.mob_contact{ display:none;}
.main_contact{
text-align: left;
margin: 40px auto;
position: relative; max-width:1140px;}
/* ------------------------------------------
  RESPONSIVE NAV STYLES
--------------------------------------------- */
.nav-collapse ul {
margin: 0;
padding: 0;
width: 100%;
display: block;
list-style: none;
}

.nav-collapse li {
width: 100%;
display: block;
}

.js .nav-collapse {
clip: rect(0 0 0 0);
max-height: 0;
position: absolute;
display: block;
overflow: hidden;
}

.nav-collapse.opened {
max-height: 9999px;
}

.disable-pointer-events {
pointer-events: none !important;
}

.nav-toggle {
-webkit-tap-highlight-color: rgba(0,0,0,0);
-webkit-touch-callout: none;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
-o-user-select: none;
user-select: none;
}

@media screen and (min-width: 62em) {
.js .nav-collapse {
position: relative;
}
.js .nav-collapse.closed {
max-height: none;
}
.nav-toggle {
display: none;
}
}


/*video*/
.video-js .vjs-big-play-button:before, .video-js .vjs-control:before {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
text-align: center; }




.video-js {
/* display:inline-block would be closer to the video el's display:inline
 * but it results in flash reloading when going into fullscreen [#2205]
 */
display: block;
/* Make video.js videos align top when next to video elements */
vertical-align: top;
box-sizing: border-box;
color: #fff;
background-color: #000;
position: relative;
padding: 0;
/* Start with 10px for base font size so other dimensions can be em based and
easily calculable. */
font-size: 10px;
line-height: 1;
/* Provide some basic defaults for fonts */
font-weight: normal;
font-style: normal;
/* Avoiding helvetica: issue #376 */
font-family: Arial, Helvetica, sans-serif;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
/* Fix for Firefox 9 fullscreen (only if it is enabled). Not needed when
checking fullScreenEnabled. */ }
.video-js:-moz-full-screen {
position: absolute; }
.video-js:-webkit-full-screen {
width: 100% !important;
height: 100% !important; }

/* All elements inherit border-box sizing */
.video-js *, .video-js *:before, .video-js *:after {
box-sizing: inherit; }

/* List style reset */
.video-js ul {
font-family: inherit;
font-size: inherit;
line-height: inherit;
list-style-position: outside;
/* Important to specify each */
margin-left: 0;
margin-right: 0;
margin-top: 0;
margin-bottom: 0; }

/* Fill the width of the containing element and use padding to create the
   desired aspect ratio. Default to 16x9 unless another ratio is given. */
/* Not including a default AR in vjs-fluid because it would override
   the user set AR injected into the header. */
.video-js.vjs-fluid, .video-js.vjs-16-9, .video-js.vjs-4-3 {
width: 100%;
max-width: 100%;
height: 0; }

.video-js.vjs-16-9 {
padding-top: 56.25%; }

.video-js.vjs-4-3 {
padding-top: 75%; }

.video-js.vjs-fill {
width: 100%;
height: 100%; }

/* Playback technology elements expand to the width/height of the containing div
<video> or <object> */
.video-js .vjs-tech {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%; }

/* Fullscreen Styles */
body.vjs-full-window {
padding: 0;
margin: 0;
height: 100%;
/* Fix for IE6 full-window. http://www.cssplay.co.uk/layouts/fixed.html */
overflow-y: auto; }

.vjs-full-window .video-js.vjs-fullscreen {
position: fixed;
overflow: hidden;
z-index: 1000;
left: 0;
top: 0;
bottom: 0;
right: 0; }

.video-js.vjs-fullscreen {
width: 100% !important;
height: 100% !important;
/* Undo any aspect ratio padding for fluid layouts */
padding-top: 0 !important; }

.video-js.vjs-fullscreen.vjs-user-inactive {
cursor: none; }

/* Hide disabled or unsupported controls. */
.vjs-hidden {
display: none !important; }

.vjs-lock-showing {
display: block !important;
opacity: 1;
visibility: visible; }

/*  In IE8 w/ no JavaScript (no HTML5 shim), the video tag doesn't register.
The .video-js classname on the video tag also isn't considered.
This optional paragraph inside the video tag can provide a message to users
about what's required to play video. */
.vjs-no-js {
padding: 20px;
color: #fff;
background-color: #000;
font-size: 18px;
font-family: Arial, Helvetica, sans-serif;
text-align: center;
width: 300px;
height: 150px;
margin: 0px auto; }

.vjs-no-js a, .vjs-no-js a:visited {
color: #66A8CC; }

.video-js .vjs-big-play-button {
font-size: 3em;
line-height: 1.5em;
height:80px;
width: 80px;
display: block;
z-index: 2;
position: absolute;
top: 50%;
left: 50%;
padding: 0;
margin:38px 0 0 -40px;
cursor: pointer;
opacity: 1;
/* Need a slightly gray bg so it can be seen on black backgrounds */
background-color: #59b246;
-webkit-border-radius: 0.3em;
-moz-border-radius: 0.3em;
border-radius: 0.3em;
-webkit-transition: all 0.4s;
-moz-transition: all 0.4s;
-o-transition: all 0.4s;
transition: all 0.4s; -webkit-border-radius:100%; -moz-border-radius:100%; border-radius:100%; background-position:33px -2853px;}

.vjs-big-play-centered .vjs-big-play-button {
top: 50%;
left: 50%;
margin-top: -0.75em;
margin-left: -1.5em; }

.video-js:hover .vjs-big-play-button, .video-js .vjs-big-play-button:focus {
outline: 0;
border-color: #fff;
background-color: #242021;
-webkit-transition: all 0s;
-moz-transition: all 0s;
-o-transition: all 0s;
transition: all 0s; }

.vjs-controls-disabled .vjs-big-play-button, .vjs-has-started .vjs-big-play-button, .vjs-using-native-controls .vjs-big-play-button, .vjs-error .vjs-big-play-button {
display: none; }

.video-js button {
background: none;
border: none;
color: inherit;
display: inline-block;
overflow: visible;
font-size: inherit;
line-height: inherit;
text-transform: none;
text-decoration: none;
transition: none;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none; }

.vjs-menu-button {
cursor: pointer; }

.vjs-menu .vjs-menu-content {
display: block;
padding: 0;
margin: 0;
overflow: auto; }

/* prevent menus from opening while scrubbing (FF, IE) */
.vjs-scrubbing .vjs-menu-button:hover .vjs-menu {
display: none; }


.vjs-menu-button-inline .vjs-menu-content {
width: auto;
height: 100%;
margin: 0;
overflow: hidden; }

.video-js .vjs-control-bar {
display: none;
width: 100%;
position: absolute;
bottom: 0;
left: 0;
right: 0;
height: 3em;
background-color: #2B333F;
background-color: rgba(43, 51, 63, 0.7); }

.vjs-has-started .vjs-control-bar {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
visibility: visible;
opacity: 1;
-webkit-transition: visibility 0.1s, opacity 0.1s;
-moz-transition: visibility 0.1s, opacity 0.1s;
-o-transition: visibility 0.1s, opacity 0.1s;
transition: visibility 0.1s, opacity 0.1s;  display:none;}

.vjs-has-started.vjs-user-inactive.vjs-playing .vjs-control-bar {
visibility: hidden;
opacity: 0;
-webkit-transition: visibility 1s, opacity 1s;
-moz-transition: visibility 1s, opacity 1s;
-o-transition: visibility 1s, opacity 1s;
transition: visibility 1s, opacity 1s; }

.vjs-controls-disabled .vjs-control-bar, .vjs-using-native-controls .vjs-control-bar, .vjs-error .vjs-control-bar {
/* !important is ok in this context. */
display: none !important; }

.vjs-audio.vjs-has-started.vjs-user-inactive.vjs-playing .vjs-control-bar {
opacity: 1;
visibility: visible; }


/* IE 8 + 9 Support */
.vjs-has-started.vjs-no-flex .vjs-control-bar {
display: table; }

.video-js .vjs-control {
outline: none;
position: relative;
text-align: center;
margin: 0;
padding: 0;
height: 100%;
width: 4em;
-webkit-box-flex: none;
-moz-box-flex: none;
-webkit-flex: none;
-ms-flex: none;
flex: none; }
.video-js .vjs-control:before {
font-size: 1.8em;
line-height: 1.67; }

/* Replacement for focus outline */
.video-js .vjs-control:focus:before, .video-js .vjs-control:hover:before, .video-js .vjs-control:focus {
text-shadow: 0em 0em 1em white; }

/* Hide control text visually, but have it available for screenreaders */
.video-js .vjs-control-text {
border: 0;
clip: rect(0 0 0 0);
height: 1px;
margin: -1px;
overflow: hidden;
padding: 0;
position: absolute;
width: 1px; }

/* IE 8 + 9 Support */
.vjs-no-flex .vjs-control {
display: table-cell;
vertical-align: middle; }

.video-js .vjs-custom-control-spacer {
display: none; }



.vjs-loading-spinner {
display: none;
position: absolute;
top: 50%;
left: 50%;
margin: -25px 0 0 -25px;
opacity: 0.85;
/* Need to fix centered page layouts */
text-align: left;
border: 6px solid rgba(43, 51, 63, 0.7);
box-sizing: border-box;
background-clip: padding-box;
width: 50px;
height: 50px;
border-radius: 25px; }

.vjs-seeking .vjs-loading-spinner, .vjs-waiting .vjs-loading-spinner {
display: block; }

.vjs-loading-spinner:before, .vjs-loading-spinner:after {
content: "";
position: absolute;
margin: -6px;
box-sizing: inherit;
width: inherit;
height: inherit;
border-radius: inherit;
/* Keep 100% opacity so they don't show through each other */
opacity: 1;
border: inherit;
border-color: transparent;
border-top-color: white; }



/* ------------------------------------------
  FIXED HEADER
--------------------------------------------- */

header {
background: none;
position: fixed;
z-index: 9;
width: 100%;
left: 0;
top: 0; padding:35px; transition:all .2s ease;
}
.sb_stick{ background-color:#252525; padding: 10px 35px 15px;}
.logo {
color: #fff;
float: left;
}

.sb_stick .nav-collapse a{ padding:28px 25px 9px}

/* ------------------------------------------
  MASK
--------------------------------------------- */

.mask {
-webkit-transition: opacity 300ms;
-moz-transition: opacity 300ms;
transition: opacity 300ms;
background: rgba(0,0,0, .5);
visibility: hidden;
position: fixed;
opacity: 0;
z-index: 2;
bottom: 0;
right: 0;
left: 0;
top: 0;
}

.android .mask {
-webkit-transition: none;
transition: none;
}

.js-nav-active .mask {
visibility: visible;
opacity: 1;
}

@media screen and (min-width: 62em) {
.mask {
display: none !important;
opacity: 0 !important;
}
}


/* ------------------------------------------
  NAVIGATION STYLES
--------------------------------------------- */

.fixed {
position: fixed;
width: 100%;
left: 0;
top: 0;
}

.nav-collapse,
.nav-collapse ul {
list-style: none;
width: 100%;
float: left;
}

@media screen and (min-width: 62em) {
.nav-collapse {
float: right;
width: auto;
}
}

.nav-collapse li {
float: left;
width: 100%;
}

@media screen and (min-width: 62em) {
.nav-collapse li {
width: auto;
}
}

.nav-collapse a {
-webkit-tap-highlight-color: rgba(0,0,0,0);
text-decoration: none;
width: 100%;
float: left;
}

.nav-collapse a:active,
.nav-collapse .active a {

}

@media screen and (min-width: 62em) {
.nav-collapse a {
text-align: center;
border-top: 0;
float: left;
margin: 0; font-size:12px; text-transform:uppercase; padding:16px 25px; font-weight:400; color:#fff;
}
.nav-collapse li:last-child a{ padding-right:0;}
}

.nav-collapse ul ul a {
background: #ca3716;
padding-left: 2em;
}

@media screen and (min-width: 62em) {
.nav-collapse ul ul a {
display: none;
}
}


/* ------------------------------------------
  NAV TOGGLE STYLES
--------------------------------------------- */
.nav-toggle {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
text-decoration: none;
text-indent: -300px;
position: relative;
overflow: hidden;
width: 73px;
height: 73px;
float: right;
}

.nav-toggle:before {
color: #fff; /* Edit this to change the icon color */
font: normal 28px/75px "responsivenav"; /* Edit font-size (28px) to change the icon size */
text-transform: none;
text-align: center;
position: absolute;
content: "\2261"; /* Hamburger icon */
text-indent: 0;
speak: none;
width: 100%;
left: 0;
top: 0;
}

.nav-toggle.active:before {
font-size: 24px;
content: "\78"; /* Close icon */
}


/*llight slider*/
.owl-carousel .owl-wrapper:after {
content: ".";
display: block;
clear: both;
visibility: hidden;
line-height: 0;
height: 0;
}
/* display none until init */
.owl-carousel{
display: none;
position: relative;
width: 100%;
-ms-touch-action: pan-y;
}
.owl-carousel .owl-wrapper{
display: none;
position: relative;
-webkit-transform: translate3d(0px, 0px, 0px);
}
.owl-carousel .owl-wrapper-outer{
overflow: hidden;
position: relative;
width: 100%;
}
.owl-carousel .owl-wrapper-outer.autoHeight{
-webkit-transition: height 500ms ease-in-out;
-moz-transition: height 500ms ease-in-out;
-ms-transition: height 500ms ease-in-out;
-o-transition: height 500ms ease-in-out;
transition: height 500ms ease-in-out;
}

.owl-carousel .owl-item{
float: left;
}
.owl-controls .owl-page,
.owl-controls .owl-buttons div{
cursor: pointer;
width: 50px;
height: 107px;
position: absolute;
bottom: -107px;
z-index: 4;
background-color: #1c1c1c;
text-indent: -9999px; transition:all .2s ease; -moz-transition:all .2s ease; -webkit-transition:all .2s ease;
}
.owl-controls .owl-page,
.owl-controls .owl-buttons div:hover{ background-color:#51a53f;}
.owl-controls .owl-buttons div.owl-next{ right:0; background-position:20px -2045px;}
.owl-controls .owl-buttons div.owl-prev{ left:0; background-position:20px -1964px;}
.owl-controls {
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

/* mouse grab icon */
.grabbing {
cursor:url(grabbing.png) 8 8, move;
}

/* fix */
.owl-carousel  .owl-wrapper,
.owl-carousel  .owl-item{
-webkit-backface-visibility: hidden;
-moz-backface-visibility:    hidden;
-ms-backface-visibility:     hidden;
-webkit-transform: translate3d(0,0,0);
-moz-transform: translate3d(0,0,0);
-ms-transform: translate3d(0,0,0);
}

/*tab*/
.resp-tabs-list{ text-align:center; width:100%; padding:0 10%;}
.resp-tabs-list li{
font-size:16px;
display:inline-block;
padding:18px 0px;
margin:0;
list-style:none;
cursor:pointer; color:#cccccc;
border:none; width:191px; position:relative; width:33.33%; margin-right:-4px;
}
.resp-tabs-list li span{ width:161px; height:161px;  display:inline-block;}
.resp-tabs-list li span.sb_acc{background-position:34px 15px;}
.resp-tabs-list li.resp-tab-active span.sb_acc{background-position:0 -461px;}
.resp-tabs-list li.resp-tab-active span.sb_fli {
background-position: 0 -684px;
}
.resp-tabs-list li span.sb_fli{background-position:25px -140px;}
.resp-tabs-list li span.sb_pay{background-position:36px -288px;}
.resp-tabs-list li.resp-tab-active span.sb_pay{background-position:0 -903px;}
.resp-tabs-list li strong{ font-weight:600;    position: absolute;
left: 0;
width: 100%;
text-align: center;
bottom: 33px;}
.resp-tabs-list li.resp-tab-active strong{ color:#0f0f0f;}
.resp-tabs-container{
padding:0px;
background-color:#fff;
clear:left;
}
h2.resp-accordion{
cursor:pointer;
padding:5px;
display:none;
}
.resp-tab-content{
display:none;
padding:35px 0px 15px; float:left;;
}

h2.resp-accordion{
font-size:18px;
margin:0px;
padding:28px 15px 21px 65px; color:#2b2b2b; text-align:left; background-color:#f6f6f6; margin-bottom:10px;

}
h2.resp-accordion strong{ font-weight:normal; }

.resp-vtabs ul.resp-tabs-list{
float:left;
width:30%;
}
.resp-vtabs .resp-tabs-list li{
display:block;
padding:15px 15px !important;
margin:0;
cursor:pointer;
float:none;
}
.resp-vtabs .resp-tabs-container{
padding:0px;
background-color:#fff;
border:1px solid #c1c1c1;
float:left;
width:68%;
min-height:250px;
border-radius:4px;
clear:none;
}
.resp-vtabs .resp-tab-content{
border:none;
}

.resp-arrow{
width:0;
height:0;
float:right;
margin-top:3px;
border-left:10px solid transparent;
border-right:10px solid transparent;
border-top:12px solid rgba(0,0,0,.5);
}
h2.resp-tab-active span.resp-arrow{
border:none;
border-left:10px solid transparent;
border-right:10px solid transparent;
border-bottom:12px solid rgba(0,0,0,.5);
}
.resp-jfit{
width:100%;
margin:0px;
}
.resp-tab-content-active{
display:block;
}


@media only screen and (max-width:1500px){
h1{ font-size:70px; line-height:75px; margin-bottom:2%;}
#home{ padding-top:160px;}

}
@media only screen and (max-width:1279px){
.container{ padding-right:15px; padding-left:15px;}
.ftr_contact li strong{width: 200px;text-align: left;line-height: 22px;}
.ftr_contact li:first-child{ margin-left:0;}
.ftr_contact li:last-child{ margin-right:0;}

button.mfp-close,
button.mfp-arrow {margin:0px 15px 0 0;}
}

@media only screen and (max-width:1023px){
.price_rept{padding:40px 15px 80px; margin: 0 20px;}
h2{ font-size:26px;}
.ftr_inner{padding:30px 0 30px}
.price_top > strong{margin: 10px 0px 30px;}
#sync1 .owl-item .item {
padding: 0 5% 40px;
}
.resp-tabs-list{padding:0;}
.tab_rept ul li span{padding: 40px 20px 30px}
#partners, #pricing{
padding: 40px 0px;
}
#work{padding:40px 0 0 0}
#work .top_heading {
margin-bottom: 10px;
}
h3 {font-size: 30px;line-height: 32px}
.tab_section{ display:none;}
.mob_tabsec{ display:block;position:relative; z-index:5;}
h1 {
font-size: 54px;
line-height: 54px;
}
#home {
padding:130px 0px 0;
}
#home .top_heading p {
font-size: 20px;
line-height: 29px;}

}


@media only screen and (max-width:992px){
.nav-collapse{ width:50%; background-color:#252525; float:right; right:-70px; top:70px;}
.contact_right{ float:left; background-color:#fff;}
.inner_contact{ display:block;}
.contact_left{ width:100%; float:left;}
.mob_contact{ display:block;}
.dek_cont{ display:none;}
.ftr_contact li{ display:block; text-align:center; margin:0 0 20px 0}
.ftr_contact li span{ display:block; padding:0; margin:0 auto 10px;}
.ftr_contact li strong, .ftr_contact li a{ display:block; text-align:center; width:100%;}
.ftr_contact {
margin: 20px 0px 30px;
}
.price_rept{ margin:0 15px; padding:40px 15px;}
h2 {
font-size: 24px;
}
.port_rept{ width:100%;}
.main_port{ display:block;}
header{ padding:0;}
header:after{ position:absolute; width:100%; height:76px; background-color:#252525; content:""; left:0; top:0; z-index:0;}
.sb_stick{ padding:0; background-color:transparent;}
header > a{ position:relative; z-index:2;}
.nav-collapse a, .sb_stick .nav-collapse a{ padding:15px; color:#fff; font-size:14px; text-transform:uppercase;}
.logo{ padding:10px 15px;}
.nav-collapse a:hover{ background-color:#59b246;}
#home:after{ height:15%;}

}

/*Here your can change the breakpoint to set the accordion, when screen resolution changed*/
@media only screen and (max-width:768px){
.resp-tab-content{ padding:10px 5px 15px;}
ul.resp-tabs-list{
display:none;
}
h2.resp-accordion{
display:block !important;    float: left;
width: 100%;
}
h2.resp-accordion.resp-tab-active{ background-color:#59b246; color:#fff;}

.resp-vtabs .resp-tabs-container{
border:none;
float:none;
width:100%;
min-height:initial;
clear:none;
}
.resp-accordion-closed{
display:none !important;
}

#custom-print-tab.resp-vtabs .resp-tabs-container, #custom-graphic-tab.resp-vtabs .resp-tabs-container{
border:none;
float:none;
width:100%;
min-height:initial;
clear:none;
}
#finishing-tab .resp-tab-content{ padding:32px 15px !important; }
.resp-accordion span.sb_acc, .resp-accordion span.sb_fli, .resp-accordion span.sb_pay{ width:40px; height:40px; display:inline-block; background-image:url("img/main_sprite.svg"); background-repeat:no-repeat; background-color:rgba(0,0,0,.2); -webkit-border-radius:100%; -moz-border-radius:100%; border-radius:100%; position:absolute;    left: 15px;
top: 15px;}
.resp-accordion span.sb_acc{ background-position:7px -2163px;}
.resp-accordion span.sb_fli{ background-position:6px -2216px;}
.resp-accordion span.sb_pay{ background-position:8px -2268px;}
h2.resp-accordion{ position:relative;}
}
@media only screen and (max-width:767px){
.sldi_cont h5 span{  width:75%;}
.footer_top .top_heading p{ padding:0;}
.main_price{ display:block; margin-top:0}
.price_rept{ margin:60px auto 0; width:auto; max-width:462px;}
.tab_rept ul li{ width:50%;}
h1 {
font-size: 40px;
line-height: 46px;
}

#home .top_heading p {
font-size: 16px;
line-height: 24px; margin-bottom:30px;
}
#home {
padding: 90px 0px 0;
}
}


@media only screen and (max-width:697px){
.nav-collapse{ width:50%; right:0px; top:0px;}

}

@media only screen and (max-width:639px){
.control_group.wd_50 .controls{ width:100%; margin-bottom:40px;}
.control_group.wd_50 .controls:last-child{margin-bottom:0;}
h3 {
font-size: 25px;
line-height: 28px;
}
.contact_heading p{ margin-bottom:5px;}
.contact_right{ padding:60px 15px 35px;}
.sldr_hover{ display:none !important;}
.ftrb_left{ width:100%; text-align: center;}
.ftrb_left p{ margin-bottom:6px;}
.ftrb_right{ width:100%;}
.footer_bottom{ padding-bottom:20px;}
}

@media only screen and (max-width:479px){
header:after{ height:60px;}
.nav-collapse{ width:75%;}
.logo{ width:210px;}
.nav-toggle{ width:58px; height:58px;}
.nav-toggle:before{ line-height:64px;}
h1 {
font-size: 30px;
line-height: 37px;
}
h2 {
font-size: 20px;
}
.price_cont ul li {
font-size: 17px;
line-height: 21px;
margin-top: 14px;
}
.port_cont{ display:none; position:static; text-align:center;}
.port_rept:hover .port_cont{ display:block;}
.port_rept:hover img {
opacity: 1;
transform: translateY(0px);
-webkit-transform: translateY(0px);
-moz-transform: translateY(0px);
-ms-transform: translateY(0px);
-o-transform: translateY(0px);
}
.ftr_menu li {
margin: 5px 0px 5px -4px;
width: 33.33%;
text-align: left;
}

}

body {
-webkit-text-size-adjust: 100%;
-ms-text-size-adjust: 100%;
text-size-adjust: 100%;

}

