@import url(http://fonts.googleapis.com/css?family=Roboto:300,400,500,900);

/***************************************************/
/********************** GERAL **********************/
/***************************************************/

body											{ margin:0; color:#000; height: 100%; }
html											{ height: 100%; }

*												{ outline:none; -webkit-font-smoothing: antialiased; font:400 14px 'Roboto'; }
img												{ border:0px; }
form											{ margin:0px; padding:0px; }

.l												{ float: left; }
.r												{ float: right; }
.b												{ font-weight: 700; }
.bb,b,strong									{ font-weight: 700; }
.hide											{ display: none; }
.show											{ display: block; }
.clear											{ clear: both; }
.color											{ color:#00ADEF; }
.clear.spacer									{ height: 50px; }
.clear.minSpacer								{ height: 20px; }
.marginSide										{ margin: 0 10px; }
.overflow										{ overflow:hidden; }



a:link											{ text-decoration: none; color:#333; }
a:visited										{ text-decoration: none; color:#333; }
a:hover											{ text-decoration: none; color:#000; }
a:active										{ text-decoration: none; color:#000; }

.input											{ background: #fff; border: 0; box-shadow: 0 0 2px #999; outline: none; resize: none; border-radius:2px; padding:7px 1%; }
.input:focus									{ box-shadow: 0 0 2px #666; }
.input::-webkit-input-placeholder				{ color:#999; }
.input:focus::-webkit-input-placeholder			{ color:#b7b7b7; }
.button,a.button								{ background: #333; color: #fff; margin: 1px; padding: 7px 15px; font-size: 11px; border: 0; transition:color,background 0.1s; border-radius:2px; }
.button:hover,a.button:hover					{ background: #000; cursor: pointer; transition:color,background 0.1s; }
.select											{ background: #fff url('../../img/bg-select-arrow.png') no-repeat 98% center; border: none; line-height: 1; -webkit-appearance: none; cursor: pointer; border-radius:2px; box-shadow: 0 0 2px #999; padding:7px 1%; }


/***************************************************/
/********************** MENUS **********************/
/***************************************************/

ul.topmenu						{ position:relative; padding:0; margin:0; margin-top:15px; list-style-type:none; display:block; }
ul.topmenu li					{ margin:0; padding:0; float: left; width: 100%; display:none; overflow:hidden; transition:width 0.3s,padding 0.3s; } 
ul.topmenu li.sep				{ color: #4D4D4D; }
ul.topmenu li.option a			{ float:left; text-decoration:none; cursor:pointer; padding: 15px 15%; width: 70%; color: #4D4D4D; transition:color 0.2s,padding 0.2s; font-size:16px; line-height:10px; }
ul.topmenu li.option.mob a		{ padding: 10px 15%; }
ul.topmenu li.option.current a	{ color: #fff; font-weight:500; transition:color 0.2s,padding 0.2s; }
ul.topmenu li a:hover			{ color: #fff; font-weight:500; padding-left:10%; transition:color 0.2s,padding 0.2s; }

.submenu,.submenu ul			{ position:absolute; margin:0; padding:0; list-style-type:none; display:none; margin-top:1px; }
.submenu li						{ position:relative; width: 218px; padding-left: 20px; }
.submenu li a					{ display:block; color:#999; text-decoration:none; font-size:16px; }
.submenu li a:hover				{ color: #fff; }



/***************************************************/
/********************* CONTENT *********************/
/***************************************************/

.loading										{ position:fixed; top:0; right:0; bottom:0; left:0; z-index:9999; }
.alignCenter									{ position:relative; width:94%; padding:0 3%; /*max-width:900px; margin:0 auto;*/ }


.body .brand									{ color: #000; opacity: 0.8; font-size: 11px; }
.body .brand img								{ vertical-align: middle; }

.support										{ position:relative; width:100%; max-width:450px; margin:50px auto; }
.support .social								{ width:50%; }



/* GERAL */
.module											{ width: 100%; transition:width 0.3s; }
section											{ position:relative; z-index:5; background:#fff; color:#333; padding:0; min-height:100%; overflow: hidden; }
section img										{ max-width:100%; height:auto; }
h1												{ margin:0; padding: 25px 0 15px 0; font-weight:900; font-size:28px; }
h2												{ margin:0; padding: 5px 0; font-weight:900; font-size:16px; }

.scroll											{ position: relative; width: 100%; height: 100%; }
.scrollDown										{ position:fixed; left:50%; margin-left:-17px; bottom:10px; width:34px; height:30px; cursor:pointer; background:url('../../img/site/img-scrollDown.png') no-repeat center center; transition:height 0.2s; z-index:99999; }
.desktop .scrollDown:hover						{ height:22px; transition:height 0.2s; }

.navigator										{ position:fixed; bottom:50px; left:3%; z-index:10; }
.navigator .selectSection						{ float:left; min-width:10px; height:10px;  padding: 10px; }
.navigator .selectSection .section				{ width: 9px; height: 9px; border:1px solid #ccc; transition:background 0.2s,border 0.2s; }
.navigator .selectSection .section.curr			{ background:#ccc; transition:background 0.2s; }
.navigator .selectSection .sectionText			{ margin-top:-3px; width:0; overflow:hidden; color:#f01; text-wrap:none; transition:width 0.2s; }
.navigator .selectSection:hover					{ background:#000; transition:background 0.2s,width 0.2s; }
.navigator .selectSection:hover .sectionText	{ width:150px; transition:width 0.2s; }
.selectSection									{ cursor:pointer; }


.social											{ width:100%; }
.social a										{ position:relative; float:left; margin:0; background-color:#333; background-position:center center; background-repeat:no-repeat; transition:background 0.2s; }
.social a img									{ max-width:100%; height:auto; }
.social a.fb:hover								{ background-color:#45619d; transition:background 0.2s; }
.social a.in:hover								{ background-color:#1582bb; transition:background 0.2s; }
.social a.be:hover								{ background-color:#007aff; transition:background 0.2s; }
.social a.sk:hover								{ background-color:#00aff0; transition:background 0.2s; }
.social a.ig:hover								{ background-color:#517fa4; transition:background 0.2s; }


.hideMe.open-menu								{ position: relative; overflow: hidden; width: 100px; text-align: right; transition:width 0.3s; }
.hideMe.open-menu img							{ margin-left: 10px; }
.open-menu										{ cursor: pointer; overflow:hidden; }
.open-menu div									{ width:100px; }
.open-menu img									{ vertical-align:middle; margin-left:15px; }


.left-bar										{ position: fixed; top: 0; right: 0; bottom: 0; width: 0; overflow: hidden; background: #222; transition:width 0.3s; z-index:20; }
.left-bar .open-menu							{ width:16px; height:16px; background: url('../../img/site/img-closeMenu.png') no-repeat center center; cursor:pointer; margin:40px 0 0 15%; }
.left-bar .lb-footer							{ position:absolute; left:0; bottom:0; right:0; }
.left-bar .lb-footer .contactInfo				{ position:relative; font-size:13px; width:70%; padding:0 15%; color: #4D4D4D; }
.left-bar .lb-footer .contactInfo a				{ color: #4D4D4D; }
.desktop .left-bar .lb-footer .open-menu:hover	{ background-color:#222; transition:background 0.2s; }

.smallMenu										{ display:inline; font-weight:400; font-size:14px; color:#000; }

.hidden-header									{ position:fixed; left:0; top:0; width: 100%; padding:7px 0; z-index:11; background:#111; display:none; overflow:hidden; z-index:19; }
.hidden-header .logo							{ height:23px; }
.hidden-header .logo img						{ max-height:100%; width:auto; vertical-align:middle; }
.hidden-header .smallMenu						{ color:#fff; margin-top:1px; }
.hidden-header a								{ color:#fff; }
.hidden-header .directContactLink				{ display:none; }

.footer											{ padding:15px 0; }
.footer .brand									{ text-align:center; font-size:12px; }
.footer .brand img								{ vertical-align:middle; }


/* HOMEPAGE */
.homepageGalGroup								{ position:fixed; top:0; left:0; width:100%; height:100%; z-index:0; }
.homepageFilter									{ position:absolute; top:0; right:0; bottom:0; left:0; z-index:1; background:#000; opacity:0.5; }
.homepageGal									{ position:absolute; top:0; right:0; bottom:0; left:0; z-index:0; }
.homepageGal .elem								{ position:absolute; top:0; right:0; bottom:0; left:0; }
.homepageGal .elem .desc						{ position: absolute; top: 50%; right: 3%; -webkit-transform: translate(0,-50%); -ms-transform: translate(0,-50%); -moz-transform: translate(0,-50%); transform: translate(0,-50%); font-size: 30px; text-align: right; }
.header											{ position:fixed; top:4%; left:0; z-index:1; }
.header .companyName							{ color:#000; }
.header a										{ color:#000; }

/* TEXT */
.content_half									{ width:44%; padding:37px 3% 0 3%; }
.content_quarter								{ width:19%; padding:37px 3% 0 3%; }
.textInfo										{ padding-bottom:37px; }
.textImages										{ position:absolute; top:0; right:0; bottom:0; }
.textImages.relative							{ position:relative; padding:0; margin-top:37px; height:500px; }
.textImages .elem								{ position:absolute; top:0; right:0; bottom:0; left:0; }


/* NEWS */
.news											{ position:relative; }
.news .desc										{ width:90%; padding:20px 3%; }
.news .image									{ position:relative; width:100%; }
.news .image img								{ width:100%; height:auto; }
.news.news_half									{ width:50%; height:100%; }
.news.news_quarter								{ width:25%; height:50%; }


/* GALERY */
.gallery										{ position:relative; width:100%; }
.gallery .elem									{ position:relative; width:20%; z-index:0; transition:box-shadow 0.2s; }
.gallery .elem img								{ width:100%; height:auto; }
.gallery .elem:hover							{ box-shadow:0 0 3px #666; z-index:1; transition:box-shadow 0.2s; }


/* SERVICES */
.services_cat									{ position:absolute; left:0; top:37px; right:0; z-index:1; }
.services_cat a									{ position:relative; float:left; text-align:center; color:#000; background:#e6e6e6; padding:5px 0; transition:background 0.2s,color 0.2s; }
.services_cat a:hover							{ background:#e1e1e1; transition:background 0.2s; }
.services_cat a.cycle-pager-active				{ color:#fff; background:#333; transition:background 0.2s,color 0.2s; }

.groupServices									{ position:absolute; top:65px; bottom:0; width:100%; z-index:0; background:#fff; }
.groupServices .servicesFilter					{ position:absolute; top:0; left:0; bottom:0; right:0; background:rgba(255,255,255,0.6); z-index:1; display:none; }
.groupServices .servicesText					{ position:absolute; top:50%; width:30%; left:0; padding:0 3%; -webkit-transform: translate(0,-50%); -ms-transform: translate(0,-50%); -moz-transform: translate(0,-50%); transform: translate(0,-50%); z-index:2; }
.groupServices .servicesText h1					{ font-size:40px; font-weight:900; }
.groupServices .servicesText .services_elem a	{ float:left; margin-right:10px; border:1px solid #333; width:15px; height:15px; transition:background 0.2s; }
.groupServices .servicesText .services_elem a.cycle-pager-active{ background:#333; transition:background 0.2s; }
.groupServices .servicesGal						{ position:absolute; width:100%; height:100%; z-index:0; }
.groupServices .servicesGal .elem				{ position:absolute; top:0; right:0; bottom:0; left:0; transition:background 0.2s; }


/* PRODUCTS */
.products										{ position:absolute; top:37px; right:0; bottom:0; left:0; }
.products .products-list						{ position:absolute; top:0; right:0; bottom:0; left:0; z-index:2; background:#fff; }
.products .products-list .elem					{ position:relative; width:20%; z-index:0; cursor:pointer; display: none; }
.products .products-list .elem .txt				{ position:absolute; top:0; width:100%; height:100%; background:rgba(0,0,0,0); transition:background 0.2s; }
.products .products-list .elem img				{ width:100%; height:auto; }
.products .products-list .elem:hover .txt		{ background:rgba(0,0,0,0.5); transition:background 0.2s; }

.products .arrow_prev							{ position:absolute; left:0; top:50%; margin-top:-60px; width:32px; height:120px; z-index:5; transition:width 0.2s; cursor:pointer; }
.products .arrow_prev .arrow					{ position:absolute; left:0; top:0; bottom:0; width:32px; background:#222 url('../../img/site/img-arrow-prev.png') no-repeat center center; }
.products .arrow_next							{ position:absolute; right:0; top:50%; margin-top:-60px; width:32px; height:120px; z-index:5; transition:width 0.2s; cursor:pointer; }
.products .arrow_next .arrow					{ position:absolute; right:0; top:0; bottom:0; width:32px; background:#222 url('../../img/site/img-arrow-next.png') no-repeat center center; }
.products .arrow_prev:hover						{ width:137px; transition:width 0.2s; }
.products .arrow_next:hover						{ width:137px; transition:width 0.2s; }


.products-desc									{ position:relative; z-index:0; text-align:center; max-height: 100%; }
.products-desc .close							{ position:fixed; top:52px; right:3%; width:16px; height:16px; padding:10px; background: rgba(255,255,255,0.1); cursor:pointer; z-index:1; transition:background 0.2s; }
.products-desc .close:hover						{ background: rgba(255,255,255,0.4); transition:background 0.2s; }
.products-desc p								{ margin:0; padding:25px 0; }
.products-desc p:nth-of-type(1)					{ margin-top:0; padding-top:0; }

/*
.products-desc						{ position:absolute; top:0; right:0; bottom:0; left:0; z-index:0; text-align:center; background:#f1f1f1; }
.products-desc .close					{ position:absolute; top:3%; right:3%; width:40px; height:40px; background:url('../../img/site/img-closeMenu_black.png') no-repeat center center; cursor:pointer; transition:background 0.2s; z-index:1; }
.products-desc .productGal			{ position:absolute; top:0; right:0; bottom:0; left:0; z-index:0; }
.products-desc .productGal .elem		{ position:relative; width:100%; height:100%; }
.products-desc .prod_nav				{ position:absolute; left:3%; bottom:3%; z-index:1; }
.products-desc .prod_nav a			{ float:left; margin-right:10px; border:1px solid #333; width:15px; height:15px; transition:background 0.2s; }
.products-desc .prod_nav a.cycle-pager-active{ background:#333; transition:background 0.2s; }
*/


/* CONTACT */
.map											{ position:absolute; left:0; top:37px; bottom:50%; width:100%; }
.map iframe										{ position:relative; width:100%; height:100%; }
.contactInfo									{ position:absolute; left:0; top:50%; width:100%; height:50%; }
.contactInfo h1									{ font-size:40px; padding-top:13px; font-weight:900; }
.contactInfo .social							{ width:50%; }
.contactInfo .brand								{ margin-top:50px; font-size:12px; }
.contactInfo .brand img							{ vertical-align:middle; }

/* Pagination */
table.pagination								{ border-collapse:collapse; float:left; margin-top:10px; font:bold 14px 'Roboto'; }
table.pagination td								{ border:1px solid #fef2e7; padding:0; text-align:center; width:20px; height:20px; }
table.pagination td.submit						{ cursor:pointer; }
table.pagination td.arrow						{ background-color:#fad7b2; }
table.pagination td.arrow.submit				{ background-color:#f1830f; }
table.pagination td.arrow.init					{ background-image:url('../../img/pag_goInit.gif'); }
table.pagination td.arrow.end					{ background-image:url('../../img/pag_goEnd.gif'); }
table.pagination td.number						{ background:#fff; height:17px; }
table.pagination td.number.submit:hover			{ background:#fef2e7; }
table.pagination td.number.current				{ color:#fff; background:#f1830f; }
table.pagination td.more						{ padding-top:4px; height:16px; border:0; }
table.pagination td.comboPag					{ border:0; padding-left:5px; }


/* USER REGIST */
.registArea											{ width: 100%; }
.registArea .input									{ width:47%; margin:0.5%; padding:7px 1%; }
.registArea .input.error							{ color:#bc0d0d; }
.registArea .input.error::-webkit-input-placeholder	{ color:#f01; }
.registArea .sepZipCode								{ margin-top:9px; color:#fff; }
.registArea .input.zipcode4							{ width:15%; }
.registArea .input.zipcode3							{ width:10%; }
.registArea .select									{ width:49%; margin:0.5%; padding:7px 1%; }
.registArea .button									{ margin:0.5%; }

.passRecover										{  }
.passRecover .input									{ border-right:0; border-radius:2px 0 0 2px; margin-right:0; width:30%; padding:7px 1%; }
.passRecover .button								{ border-radius:0 2px 2px 0; margin-left:0; padding:7px 1%; }

.loginArea											{ width: 30%; }
.loginArea p										{ margin: 0; }


/* SCROLL */
.jspContainer									{ overflow:hidden; position:relative; }
.jspPane										{ position:absolute; }
.jspVerticalBar									{ position: absolute; top: 0; right: 0; width: 6px; height: 100%; padding: 2px; }
.jspHorizontalBar								{ position: absolute; bottom: 0; left: 0; width: 100%; height: 5px; }
.jspVerticalBar *,
.jspHorizontalBar *								{ margin: 0; padding: 0; }
.jspCap											{ display: none; }
.jspHorizontalBar .jspCap						{ float: left; }
.jspTrack										{ background:none; position: relative;  }
.jspDrag										{ background:#1c1c1c; position: relative; box-shadow: 0 0 3px #000; top: 0; left: 0; cursor: pointer; }
.jspDrag:hover									{ background-position:center right; }
.jspHorizontalBar .jspTrack,
.jspHorizontalBar .jspDrag						{ float: left; height: 100%; }
.jspArrow										{ background: #50506d; text-indent: -20000px; display: block; cursor: pointer; }
.jspArrow.jspDisabled							{ cursor: default; background: #80808d; }
.jspVerticalBar .jspArrow						{ height: 5px; }
.jspHorizontalBar .jspArrow						{ width: 5px; float: left; height: 100%; }
.jspVerticalBar .jspArrow:focus					{ outline: none; }
.jspCorner										{ background: #eeeef4; float: left; height: 100%; }
/* Yuk! CSS Hack for IE6 3 pixel bug :( */
* html .jspCorner								{ margin: 0 -3px 0 0; }




/* Tooltips */
.tipsy { padding: 5px; font-size:13px; position: absolute; z-index: 100000; }
.tipsy-inner { padding: 5px 8px 4px 8px; background-color: black; color: white; max-width: 200px; text-align: center; }
.tipsy-inner { border-radius: 3px; /*-moz-border-radius:3px; -webkit-border-radius:3px;*/ }
.tipsy-arrow { position: absolute; background: url('../../img/tipsy.gif') no-repeat top left; width: 9px; height: 5px; }
.tipsy-n .tipsy-arrow { top: 0; left: 50%; margin-left: -4px; }
.tipsy-nw .tipsy-arrow { top: 0; left: 10px; }
.tipsy-ne .tipsy-arrow { top: 0; right: 10px; }
.tipsy-s .tipsy-arrow { bottom: 0; left: 50%; margin-left: -4px; background-position: bottom left; }
.tipsy-sw .tipsy-arrow { bottom: 0; left: 10px; background-position: bottom left; }
.tipsy-se .tipsy-arrow { bottom: 0; right: 10px; background-position: bottom left; }
.tipsy-e .tipsy-arrow { top: 50%; margin-top: -4px; right: 0; width: 5px; height: 9px; background-position: top right; }
.tipsy-w .tipsy-arrow { top: 50%; margin-top: -4px; left: 0; width: 5px; height: 9px; }



/* Messages */
div.dialog{ margin:10px 0; padding:20px 2%; text-align:left; color:#000; box-shadow:0 0 2px #000; border-radius:2px; font-size:11px; }
div.dialog.done{ background:#ceef73; }
div.dialog.error{ background:#ef7373; }
div.dialog.notes{ background:#73b3ef; }
div.dialog li{ margin-left:20px; }
div.dialog p{ margin-left:0; }













.progressjs-inner {
    width: 0;
}
.progressjs-progress {
    z-index: 9999999;
}

/* blue theme, like iOS 7 progress bar */
.progressjs-theme-blue .progressjs-inner {
    height: 2px;
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
    background-color: #3498db;
}
.progressjs-theme-blue.progressjs-end {
    -webkit-transition: opacity 0.2s ease-out;
    -moz-transition: opacity 0.2s ease-out;
    -o-transition: opacity 0.2s ease-out;
    transition: opacity 0.2s ease-out;
    opacity: 0;
}
.progressjs-theme-blue .progressjs-percent {
    display: none;
}

/* blue theme with overlay layer, no percent bar */
.progressjs-theme-blueOverlay {
    background-color: white;
    -webkit-transition: all 0.2s ease-out;
    -moz-transition: all 0.2s ease-out;
    -o-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out;
}
.progressjs-theme-blueOverlay .progressjs-inner {
    height: 100%;
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
    background-color: #3498db;
}
.progressjs-theme-blueOverlay.progressjs-end {
    opacity: 0 !important;
}
.progressjs-theme-blueOverlay .progressjs-percent {
    display: none;
}

/* blue theme with overlay layer, no percent bar */
.progressjs-theme-blueOverlay {
    background-color: white;
    -webkit-transition: all 0.2s ease-out;
    -moz-transition: all 0.2s ease-out;
    -o-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out;
}
.progressjs-theme-blueOverlay .progressjs-inner {
    height: 100%;
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
    background-color: #3498db;
}
.progressjs-theme-blueOverlay.progressjs-end {
    opacity: 0 !important;
}
.progressjs-theme-blueOverlay .progressjs-percent {
    display: none;
}

/* Blue theme with border radius and overlay layer */
.progressjs-theme-blueOverlayRadius {
    background-color: white;
    -webkit-transition: all 0.2s ease-out;
    -moz-transition: all 0.2s ease-out;
    -o-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out;
    border-radius: 5px;
}
.progressjs-theme-blueOverlayRadius .progressjs-inner {
    height: 100%;
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
    background-color: #3498db;
    border-radius: 5px;
}
.progressjs-theme-blueOverlayRadius.progressjs-end {
    opacity: 0 !important;
}
.progressjs-theme-blueOverlayRadius .progressjs-percent {
    display: none;
}

/* Blue theme with border radius and overlay layer */
.progressjs-theme-blueOverlayRadiusHalfOpacity {
    background-color: white;
    opacity: 0.5;
   -webkit-transition: all 0.2s ease-out;
    -moz-transition: all 0.2s ease-out;
    -o-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out;
    border-radius: 5px;
}
.progressjs-theme-blueOverlayRadiusHalfOpacity .progressjs-inner {
    height: 100%;
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
    background-color: #3498db;
    border-radius: 5px;
}
.progressjs-theme-blueOverlayRadiusHalfOpacity.progressjs-end {
    opacity: 0 !important;
}
.progressjs-theme-blueOverlayRadiusHalfOpacity .progressjs-percent {
    display: none;
}

/* Blue theme with border radius, overlay layer and percent bar */
.progressjs-theme-blueOverlayRadiusWithPercentBar {
    background-color: white;
    -webkit-transition: all 0.2s ease-out;
    -moz-transition: all 0.2s ease-out;
    -o-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out;
    border-radius: 5px;
}
.progressjs-theme-blueOverlayRadiusWithPercentBar .progressjs-inner {
    height: 100%;
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
    background-color: #3498db;
    border-radius: 5px;
}
.progressjs-theme-blueOverlayRadiusWithPercentBar.progressjs-end {
    opacity: 0 !important;
}
.progressjs-theme-blueOverlayRadiusWithPercentBar .progressjs-percent {
    width: 70px;
    text-align: center;
    height: 40px;
    position: absolute;
    right: 50%;
    margin-right: -35px;
    top: 50%;
    margin-top: -20px;
    font-size: 30px;
    opacity: .5;
}

.progressjs-theme-blackRadiusInputs {
    height: 10px;
    border-radius: 10px;
    overflow: hidden;
}
.progressjs-theme-blackRadiusInputs .progressjs-inner {
    height: 2px;
    -webkit-transition: all 1s ease-out;
    -moz-transition: all 1s ease-out;
    -o-transition: all 1s ease-out;
    transition: all 1s ease-out;
    background-color: #34495e;
}
.progressjs-theme-blackRadiusInputs.progressjs-end {
    -webkit-transition: opacity 0.2s ease-out;
    -moz-transition: opacity 0.2s ease-out;
    -o-transition: opacity 0.2s ease-out;
    transition: opacity 0.2s ease-out;
    opacity: 0;
}
.progressjs-theme-blackRadiusInputs .progressjs-percent {
    display: none;
}