@import url(http://fonts.googleapis.com/css?family="Open Sans",; sans-serif:400, 300, 100, 700, 100italic, 300italic, 400italic, 700italic);
body {
/*padding-top: 93px;*/
background: #fff;
font-family: 'Open Sans', sans-serif;
color: #64686d;
line-height: 26px;
}
h1, h2, h3, h4, h5, h6 {
font-weight: 600;
font-family: '"Open Sans",sans-serif', sans-serif;
color: #7d7d7d;
}
a {
color: #333;
-webkit-transition: color 400ms, background-color 400ms;
-moz-transition: color 400ms, background-color 400ms;
-o-transition: color 400ms, background-color 400ms;
transition: color 400ms, background-color 400ms;
}
hr {
border-top: 1px solid #e5e5e5;
border-bottom: 1px solid #fff;
}
.gradiant {
background-image: -moz-linear-gradient(90deg, #2caab3 0%, #2c8cb3 100%);
background-image: -webkit-linear-gradient(90deg, #2caab3 0%, #2c8cb3 100%);
background-image: -ms-linear-gradient(90deg, #2caab3 0%, #2c8cb3 100%);
}
.gradiant-horizontal {
background-image: -moz-linear-gradient(4deg, #2caab3 0%, #2c8cb3 100%);
background-image: -webkit-linear-gradient(4deg, #2caab3 0%, #2c8cb3 100%);
background-image: -ms-linear-gradient(4deg, #2caab3 0%, #2c8cb3 100%);
}
.section-header {
margin-bottom: 50px;
}
.section-header .section-title {
font-size: 4em!important;
color: #7d7d7d;
text-transform: uppercase;
position: relative;
padding-bottom: 0;
margin: 0 0 20px;
font-family: "Abel",sans-serif
}
.section-header .section-title:before {
content: "";
position: absolute;
width: 140px;
bottom: 0;
left: 50%;
margin-left: -70px;
height: 1px;
}
.ContactTxt:before{
background:#fff!important;
}
/*.section-header .section-title:after {
content: "";
position: absolute;
width: 24px;
height: 24px;
bottom: -11px;
left: 50%;
margin-left: -12px;
border: 5px solid #fff;
border-radius: 20px;
background: #45aed6;
}*/
.btn {
border-width: 0;
border-bottom-width: 3px;
border-radius: 3px;
}
.btn.btn-primary {
background: #8269C0!important;
color: #FFF !important;
border-color: #B496FF;
}
.btn.btn-primary:hover, .btn.btn-primary:focus {
background: #D1AE49!important;
color: #FFF !important;
border-color:#bd9020;
}
.column-title {
margin-top: 0;
padding-bottom: 6px;
margin-bottom: 4px;
position: relative;
font-size:0.9em;
font-family:"Abel",sans-serif;
}
.column-title:after {
content: " ";
position: absolute;
bottom: -1px;
left: 0;
width: 100%;
border-bottom: 1px solid #4D2A9E;
}
ul.nostyle {
list-style: none;
padding: 0;
margin-bottom: 20px;
font-size: 16px;
}
ul.nostyle i {
color: #6146AA;
margin-right: 4px;
}
.scaleIn {
-webkit-animation-name: scaleIn;
animation-name: scaleIn;
}
@-webkit-keyframes scaleIn {
0% {
opacity: 0;
-webkit-transform: scale(0);
transform: scale(0);
}
100% {
opacity: 1;
-webkit-transform: scale(1);
transform: scale(1);
}
}
@keyframes scaleIn {
0% {
opacity: 0;
-webkit-transform: scale(0);
-ms-transform: scale(0);
transform: scale(0);
}
100% {
opacity: 1;
-webkit-transform: scale(1);
-ms-transform: scale(1);
transform: scale(1);
}
}
.navbar.navbar-default {
border: 0;
border-radius: 0;
margin-bottom: 0;
z-index: 1111111;
}
.navbar.navbar-default .navbar-toggle {
margin-top: 6px;
}
.navbar.navbar-default .navbar-brand {
height: auto;
padding: 3px 2px 4px !important;
}
#main-slider {
overflow: hidden;
}
#main-slider .item {
height: 580px;
background-repeat: no-repeat;
background-position: 50% 0;
background-size: cover;
}
#main-slider .slider-inner {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
color: #fff;
}
#main-slider .slider-inner h2 {
margin-top: 180px;
font-size: 28px;
line-height: 36px;
/* text-transform: uppercase;*/
color: #fff;
padding-left: 10px;
padding-top: 16px;
}
#main-slider .slider-inner h2 > span {
color: #FFF;
}
#main-slider .slider-inner .btn {
margin-top: 10px;
}
#main-slider .owl-prev, #main-slider .owl-next {
position: absolute;
top: 50%;
background-color: rgba(0, 0, 0, 0.2);
color: #fff;
font-size: 30px;
display: inline-block;
margin-top: -35px;
height: 70px;
width: 70px;
line-height: 70px;
text-align: center;
border-radius: 100px;
z-index: 5;
-webkit-transition: background-color 400ms;
transition: background-color 400ms;
}
#main-slider .owl-prev:hover, #main-slider .owl-next:hover {
background-color: #432891;
}
#main-slider .owl-prev {
left: -35px;
text-indent: 14px;
}
#main-slider .owl-next {
right: -35px;
text-indent: -14px;
}
#bar {
width: 0%;
max-width: 100%;
height: 4px;
background: #63C;
}
#progressBar {
margin-top: -4px;
position: relative;
z-index: 999;
width: 100%;
background: rgba(0, 0, 0, 0.1);
}
#cta {
padding: 100px 0 150px;
background-color: #eeeeee;
}
#cta h2 {
margin-top: 0;
}
#cta .btn {
margin-top: 40px;
}
#cta2 {
background: #242a33 url(../images/cta2/cta2-bg.jpg) no-repeat 50% 50%;
background-size: cover;
color: #fff;
padding-top: 70px;
}
#cta2 .btn {
margin-top: 10px;
}
#cta2 h2 {
color: #fff;
font-size: 44px;
line-height: 1;
}
#cta2 h2 > span {
color: #45aed6;
}
#Industry-Solutions {
padding: 40px 0 19px;
}
#Industry-Solutions .media.service-box:first-child {
margin-top: 80px;
}
#Technology-Focus {
padding: 60px 0 26px;
background: url(../../Images/animated-number/bg.jpg) no-repeat 0 0;
background-size: cover;
}
.media.service-box {
margin:14px 0;
}
.media.service-box .pull-left {
margin-right: 20px;
}
.media.service-box .pull-left > i {
font-size: 24px;
height: 64px;
line-height: 57px;
text-align: center;
width: 64px;
border-radius: 20px;
color: #fff;
border: 4px solid #000;
box-shadow: inset 0 0 0 5px rgba(255, 255, 255, 1);
-webkit-box-shadow: inset 0 0 0 5px rgba(255, 255, 255, 1);
position: relative;
background:#836ABD;
}
.media.service-box .pull-left > i:after {
content: "";
position: absolute;
width: 20px;
height: 20px;
top: 50%;
margin-top: -10px;
right: -10px;
border: 4px solid #fff;
border-radius: 20px;
background: #836ABD;
}
.media.service-box:hover .pull-left > i {
background-image: -webkit-linear-gradient(90deg, #8C70BF 0%, #563B9E 100%);
background-image: -webkit-linear-gradient(90deg, #8C70BF 0%, #563B9E 100%);
background-image: -ms-linear-gradient(90deg, #8C70BF 0%, #563B9E 100%);
color: #fff;
box-shadow: inset 0 0 0 5px rgba(255, 255, 255, 0.8);
-webkit-box-shadow: inset 0 0 0 5px rgba(255, 255, 255, 0.8);
}
#portfolio {
padding: 100px 0;
background: #f5f5f5;
}
#portfolio .portfolio-filter {
list-style: none;
padding: 0;
margin: 0 0 50px;
display: inline-block;
}
#portfolio .portfolio-filter > li {
float: left;
display: block;
}
#portfolio .portfolio-filter > li a {
display: block;
padding: 7px 15px;
background: #e5e5e5;
color: #64686d;
position: relative;
}
#portfolio .portfolio-filter > li a:hover, #portfolio .portfolio-filter > li a.active {
background: #6146AA;
color: #fff;
box-shadow: 0 -3px 0 0 #4A23B1 inset;
-webkit-box-shadow: 0 -3px 0 0 #4A23B1 inset;
}
#portfolio .portfolio-filter > li a.active:after {
content: " ";
position: absolute;
bottom: -17px;
left: 50%;
margin-left: -10px;
border-width: 10px;
border-style: solid;
border-color: #6146AA transparent transparent transparent;
}
#portfolio .portfolio-filter > li:first-child a {
border-radius: 4px 0 0 4px;
}
#portfolio .portfolio-filter > li:last-child a {
border-radius: 0 4px 4px 0;
}
#portfolio .portfolio-items {
margin: -15px;
}
#portfolio .portfolio-item {
width: 24.9%;
float: left;
padding: 15px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-o-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
}
#portfolio .portfolio-item .portfolio-item-inner {
position: relative;
}
#portfolio .portfolio-item .portfolio-item-inner .portfolio-info {
opacity: 0;
transition: opacity 400ms;
-webkit-transition: opacity 400ms;
position: absolute;
bottom: 0;
left: 0;
right: 0;
padding: 10px;
background: rgba(0, 0, 0, 0.5);
color: #fff;
}
#portfolio .portfolio-item .portfolio-item-inner .portfolio-info h3 {
font-size: 16px;
line-height: 1;
margin: 0;
color: #fff;
}
#portfolio .portfolio-item .portfolio-item-inner .portfolio-info .preview {
position: absolute;
top: -18px;
right: 12px;
border-radius: 50%;
background-image: -moz-linear-gradient(90deg, #6146AA 0%, #604D94 100%);
background-image: -webkit-linear-gradient(90deg, #6146AA 0%, #604D94 100%);
background-image: -ms-linear-gradient(90deg, #6146AA 0%, #604D94 100%);
width: 36px;
height: 36px;
line-height: 36px;
text-align: center;
color: #fff;
box-shadow: 0 0 0 2px #fff;
-webkit-box-shadow: 0 0 0 2px #fff;
}
#portfolio .portfolio-item:hover .portfolio-info {
opacity: 1;
}
/* Start: Recommended Isotope styles */
/**** Isotope Filtering ****/
.isotope-item {
z-index: 2;
}
.isotope-hidden.isotope-item {
pointer-events: none;
z-index: 1;
}
/**** Isotope CSS3 transitions ****/
.isotope, .isotope .isotope-item {
-webkit-transition-duration: 0.8s;
-moz-transition-duration: 0.8s;
-ms-transition-duration: 0.8s;
-o-transition-duration: 0.8s;
transition-duration: 0.8s;
}
.isotope {
-webkit-transition-property: height, width;
-moz-transition-property: height, width;
-ms-transition-property: height, width;
-o-transition-property: height, width;
transition-property: height, width;
}
.isotope .isotope-item {
-webkit-transition-property: -webkit-transform, opacity;
-moz-transition-property: -moz-transform, opacity;
-ms-transition-property: -ms-transform, opacity;
-o-transition-property: -o-transform, opacity;
transition-property: transform, opacity;
}
/**** disabling Isotope CSS3 transitions ****/
.isotope.no-transition, .isotope.no-transition .isotope-item, .isotope .isotope-item.no-transition {
-webkit-transition-duration: 0s;
-moz-transition-duration: 0s;
-ms-transition-duration: 0s;
-o-transition-duration: 0s;
transition-duration: 0s;
}
/* End: Recommended Isotope styles */
/* disable CSS transitions for containers with infinite scrolling*/
.isotope.infinite-scrolling {
-webkit-transition: none;
-moz-transition: none;
-ms-transition: none;
-o-transition: none;
transition: none;
}
#testimonial {
background: #333333 url(../images/testimonial/bg.jpg) no-repeat 0 0;
background-size: cover;
padding: 100px 0;
color: #fff;
}
#testimonial h4 {
color: #fff;
margin-bottom: 0;
}
#testimonial small {
display: block;
margin-bottom: 10px;
color: rgba(255, 255, 255, 0.7);
}
.btns {
bottom: 172px;
position: relative;
}
#testimonial .btns {
margin-top: 10px;
}
#about {
padding: 100px 0;
}
#work-process {
padding: 110px 0;
background: #20222e url(../../Images/work-process/bg.jpg) no-repeat 0 0;
background-size: cover;
color: #fff;
}
#work-process h2 {
color: #fff;
}
#work-process h3 {
color: #fff;
margin-bottom: 0;
}
#work-process .icon-circle {
display: inline-block;
width: 80px;
height: 80px;
line-height: 80px;
border: 2px solid #D2AD47;
border-radius: 100px;
position: relative;
}
#work-process .icon-circle > span {
border-style: solid;
border-width: 2px;
border-color: #D0B044;
border-radius: 50%;
background-color: #fff;
position: absolute;
width: 24px;
height: 24px;
line-height: 20px;
top: -12px;
color: #64686d;
}
#work-process h3 {
margin-bottom: 50px;
}
#meet-team {
padding: 100px 0;
}
#meet-team .team-member {
padding: 13px;
background: #eeeeee;
border: 2px solid #eeeeee;
transition: border-color 400ms;
-webkit-transition: border-color 400ms;
}
#meet-team .team-member .team-img {
margin: -15px -15px 0 -15px;
}
#meet-team .team-member .team-info {
padding-bottom: 10px;
border-bottom: 1px solid #dbdbdb;
margin-bottom: 10px;
}
#meet-team .team-member:hover {
border-color: #45aed6;
}
#meet-team .team-member:hover .social-icons > li > a {
background: #45aed6;
}
#meet-team .social-icons {
list-style: none;
padding: 0;
margin: 0;
}
#meet-team .social-icons > li {
display: inline-block;
}
#meet-team .social-icons > li > a {
display: block;
width: 32px;
height: 32px;
line-height: 32px;
text-align: center;
color: #fff;
background: #222534;
border-radius: 3px;
}
.divider {
margin-top: 50px;
margin-bottom: 50px;
background-image: -moz-linear-gradient(180deg, #ffffff 0%, #e3e3e3 49%, #ffffff 100%);
background-image: -webkit-linear-gradient(180deg, #ffffff 0%, #e3e3e3 49%, #ffffff 100%);
background-image: -ms-linear-gradient(180deg, #ffffff 0%, #e3e3e3 49%, #ffffff 100%);
width: 95%;
height: 1px;
}
.progress {
-webkit-box-shadow: none;
box-shadow: none;
background: #eeeeee;
}
.progress .progress-bar.progress-bar-primary {
background-image: -moz-linear-gradient(4deg, #2caab3 0%, #2c8cb3 100%);
background-image: -webkit-linear-gradient(4deg, #2caab3 0%, #2c8cb3 100%);
background-image: -ms-linear-gradient(4deg, #2caab3 0%, #2c8cb3 100%);
-webkit-box-shadow: none;
box-shadow: none;
}
.nav.main-tab {
background: rgba(238, 238, 238, 0.12);
/*border-bottom: 3px solid #222534;*/
border-radius: 3px 3px 0 0;
}
.nav.main-tab > li > a {
color: #FFF;
}
.nav.main-tab > li.active > a {
background: rgba(88, 88, 88, 0.48);
color: #FFFFFF;
}
.nav.main-tab > li:first-child > a {
border-radius: 3px 0 0 0;
}
.nav.main-tab > li:last-child > a {
border-radius: 0 3px 0 0;
}
.tab-content {
/* border: 1px solid #D5AE42;*/
border-top: 0;
padding: 20px 20px 10px;
border-radius: 0 0 3px 3px;
}
.panel-default {
border-color: #eee;
}
.panel-title > a {
font-size: 19px;
}
.panel-group .panel-heading {
border-bottom: 1px solid #CCC !important;
}
.panel-default > .panel-heading {
border-color: #eee;
cursor: pointer;
}
.panel-default > .panel-heading .panel-title {
font-size: 14px;
font-weight: bold;
font-family:"Abel",sans-serif;
}
.panel-default > .panel-heading + .panel-collapse > .panel-body {
border-top-color: #eee;
}
#animated-number {
padding: 100px 0 70px;
background: #132125 url(../images/animated-number/bg.jpg) no-repeat 0 0;
background-size: cover;
color: #fff;
}
#animated-number h1, #animated-number h2, #animated-number h3, #animated-number h4 {
color: #fff;
}
#animated-number strong {
display: block;
margin-bottom: 30px;
}
.animated-number {
display: inline-block;
width: 140px;
height: 140px;
font-size: 24px;
line-height: 140px;
border: 3px solid #fff;
border-radius: 100px;
margin-bottom: 20px;
}
#pricing {
padding: 100px 0 70px;
}
#pricing ul.pricing {
list-style: none;
padding: 0;
margin: 70px 0 30px;
border: 1px solid #eee;
border-radius: 5px 5px 4px 4px;
padding: 15px;
text-align: center;
}
#pricing ul.pricing li {
display: block;
padding: 10px;
}
#pricing ul.pricing li.plan-header {
background: #eee;
border-radius: 4px 4px 0 0;
margin: -15px -15px 10px;
padding: 15px 15px 30px;
border: 0;
}
#pricing ul.pricing li.plan-header .price-duration {
position: relative;
margin-top: -63px;
top: -10px;
display: inline-block;
width: 116px;
height: 116px;
background-image: -moz-linear-gradient(90deg, #2caab3 0%, #2c8cb3 100%);
background-image: -webkit-linear-gradient(90deg, #2caab3 0%, #2c8cb3 100%);
background-image: -ms-linear-gradient(90deg, #2caab3 0%, #2c8cb3 100%);
color: #fff;
border-radius: 100px;
border: 5px solid #f6f6f6;
}
#pricing ul.pricing li.plan-header .price-duration > span {
display: block;
line-height: 1;
}
#pricing ul.pricing li.plan-header .price-duration > span.price {
font-size: 24px;
font-weight: 700;
margin-top: 35px;
}
#pricing ul.pricing li.plan-header .price-duration > span.duration {
margin-top: 5px;
}
#pricing ul.pricing li.plan-header .plan-name {
margin-top: 10px;
font-size: 24px;
color: #272727;
font-weight: bold;
line-height: 1;
text-transform: uppercase;
}
#pricing ul.pricing.featured {
background: #222534;
color: #fff;
border: 0;
}
#pricing ul.pricing.featured li.plan-header {
background-image: -moz-linear-gradient(90deg, #2caab3 0%, #2c8cb3 100%);
background-image: -webkit-linear-gradient(90deg, #2caab3 0%, #2c8cb3 100%);
background-image: -ms-linear-gradient(90deg, #2caab3 0%, #2c8cb3 100%);
}
#pricing ul.pricing.featured li.plan-header .plan-name {
color: #fff;
}
#Corporate {
padding: 60px 0px 41px;
}
#contact-us {
background: rgb(32, 34, 46) url("../../Images/work-process/bg-contact.jpg") no-repeat scroll 0px 0px ;
background-size:cover;
padding: 52px 0 28px;
}
#contact-us h1, #contact-us h2 {
color: #fff;
}
#clients {
padding: 64px 0px;
}
.newmargincl { margin-top:15px;
}
.btnsnew {
position: relative;
bottom: 126px;
}
.thumbnail{
border:1px solid #c1c1c1;
}
.thumbnail:hover{
border:1px solid #c1c1c1!important;
}
.thumbnail>img, .thumbnail a>img {
border-radius: 10px;
}
a:hover, a:focus {
color: #66C !important;
text-decoration: none;
}
#blog {
padding: 100px 0;
}
#vison-mission-valus {
padding: 50px 0;
}
#blog .blog-post {
border: 1px solid #eee;
padding: 15px;
}
#blog .blog-post .post-format {
display: inline-block;
width: 40px;
height: 40px;
line-height: 34px;
text-align: center;
color: #fff;
background: #6C53AF;
border: 3px solid #fff;
border-radius: 100px;
}
#blog .blog-post.blog-large .entry-thumbnail {
margin: -15px -15px 15px;
position: relative;
}
#blog .blog-post.blog-large .post-format {
width: 66px;
height: 66px;
line-height: 60px;
position: absolute;
right: 20px;
bottom: -33px;
}
#blog .blog-post.blog-large .post-format > i {
font-size: 20px;
}
#blog .blog-post.blog-large .entry-date {
font-size: 12px;
display: block;
margin-bottom: 5px;
text-transform: uppercase;
color: #45aed6;
}
#blog .blog-post.blog-large .entry-title {
margin-top: 0;
font-size: 18px;
line-height: 1;
margin-bottom: 15px;
}
#blog .blog-post.blog-large .entry-title a {
color: #64686d;
}
#blog .blog-post.blog-large .entry-title a:hover {
color: #45aed6;
}
#blog .blog-post.blog-media {
margin-bottom: 30px;
}
#blog .blog-post.blog-media .entry-thumbnail {
margin: -15px 15px -15px -15px;
position: relative;
}
#blog .blog-post.blog-media .post-format {
position: absolute;
top: 20px;
right: -10px;
}
#blog .blog-post.blog-media .entry-date {
font-size: 12px;
display: block;
margin-bottom: 5px;
text-transform: uppercase;
color: #45aed6;
}
#blog .blog-post.blog-media .entry-title {
margin-top: 0;
font-size: 18px;
line-height: 1;
margin-bottom: 15px;
}
#blog .blog-post.blog-media .entry-title a {
color: #64686d;
}
#blog .blog-post.blog-media .entry-title a:hover {
color: #45aed6;
}
#blog .blog-post .entry-meta {
margin-top: 20px;
border-top: 1px solid #eee;
padding-top: 15px;
}
#blog .blog-post .entry-meta > span {
display: inline-block;
margin-right: 10px;
color: #999;
}
#blog .blog-post .entry-meta > span > a {
color: #999;
}
#blog .blog-post .entry-meta > span > a:hover {
color: #45aed6;
}
#contact {
position: relative;
overflow: hidden;
}
#contact .container-wrapper {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(69, 174, 214, 0.3);
z-index: 1;
}
#contact .contact-form {
background: rgba(0, 0, 0, 0.75);
padding: 20px;
margin-top: 50px;
color: #FFF;
}
#contact .contact-form h3 {
margin-top: 0;
color: #FFF;
}
/***********************
********* Footer ******
************************/
#footer {
padding-top: 30px;
padding-bottom: 30px;
color: #fff;
background: #000;
}
#footer a {
color: #fff;
}
#footer a:hover {
color: #45aed6;
}
#footer ul {
list-style: none;
padding: 0;
margin: 0 -7.5px;
}
#footer ul > li {
display: inline-block;
margin: 0 7.5px;
}
.form-control {
box-shadow: none;
-webkit-box-shadow: none;
}
.newform {
font: 700 13px '', sans-serif;
background-color: #FFF;
border: 1px solid #cccccc;
color: #6a6a6a !important;
display: block;
height: 40px;
line-height: 1.42857;
padding: 6px 12px;
vertical-align: middle;
width: 100%;
}
textarea {
resize: none;
}
.nav>li>a {
font-weight: 700;
padding: 10px 10px;
}
.p {
font-size: 18px!important;
line-height: 22px;
font-family:"Abel",sans-serif;
}
.myclass {
padding-top: 13px;
background: rgba(4, 4, 4, 0);
color: #FFF;
outline: 1px solid #fff;
}
.newfont {
font: 300 41px 'Open Sans', sans-serif !important;
color: #434343 !important;
}
.fa-5x {
font-size: 7em !important
}
.marginnew {
margin-left: 419px;
}
.navbar-default .navbar-nav>.active>a, .navbar-default .navbar-nav>.active>a:hover, .navbar-default .navbar-nav>.active>a:focus {
color: #fff !important;
background:#7c66bf!important;
}
.media.service-box:hover .pull-left > i {
background-image: -moz-linear-gradient(90deg, #8C70BF 0%, #563B9E 100%);
background-image: -o-linear-gradient(90deg, #8C70BF 0%, #563B9E 100%);
background-image: -ms-linear-gradient(90deg, #8C70BF 0%, #563B9E 100%);
background-image: linear-gradient(90deg, #8C70BF 0%, #563B9E 100%);
}
/*newadd*/
.work-section {
padding: 6em 0;
}
.work-section-grid {
margin-top: 8em;
position: relative;
}
i.ear-phones {
height: 85px;
width: 85px;
background: url(../images/img-sprite.png) no-repeat -200px 0px;
display: inline-block;
}
.work-section-grid h4 {
color: #394b50;
font-family: "Open Sans", sans-serif;
font-size: 1.5em;
font-weight: 700;
margin-bottom: 0.8em;
text-transform: uppercase;
margin-top: 4em;
}
.work-section-grid p {
color: #7b7b7b;
font-size: 0.95em;
font-weight: 400;
line-height: 1.8em;
margin-bottom: 6em;
}
span.arrow1 {
position: absolute;
top: -35px;
right: -64px;
}
i.lock {
height: 85px;
width: 85px;
background: url(../images/img-sprite.png) no-repeat -285px 0px;
display: inline-block;
}
span.arrow2 {
position: absolute;
top: 78px;
right: -77px;
}
i.cloud {
height: 85px;
width: 85px;
background: url(../images/img-sprite.png) no-repeat -370px 0px;
display: inline-block;
}
span.arrow1 {
position: absolute;
top: -30px;
right: -77px;
}
i.done {
height: 85px;
width: 85px;
background: url(../images/img-sprite.png) no-repeat -455px 0px;
display: inline-block;
}
.mycolor {
color: rgba(214, 177, 67, 0.83);
}
/*********** INFORMATION *****************************
- document: Slick and Clean CSS3 forms pack
- element: Contact form with map
- author: Capelle @ Codecanyon
- profile: http://codecanyon.net/user/Capelle
*****************************************************/
/* ==================
1. FONTS
================== */
@import url(http://fonts.googleapis.com/css?family=Lobster); /* Lobster font for headings */
@import url(http://fonts.googleapis.com/css?family=Lato);
/* Lato font for the content */
/* Entypo pictograms by Daniel Bruce  www.entypo.com */
@charset "UTF-8";
@font-face {
font-family: 'FontAwesome' !important;
font-family: 'entypo '!important;
font-style: normal;
font-weight: normal;
src: url('icons/entypo/entypo.eot');
src: url('icons/entypo/entypo.eot?#iefix') format('eot'), url('icons/entypo/entypo.woff') format('woff'), url('fonts/entypo.otf') format('truetype'),
}
.entypo-note:before {
content: "\266a"
}
.entypo-note-beamed:before {
content: "\266b"
}
.entypo-music:before {
content: "\1f3b5"
}
.entypo-search:before {
content: "\1f50d"
}
.entypo-flashlight:before {
content: "\1f526"
}
.entypo-mail:before {
content: "\2709"
}
.entypo-heart:before {
content: "\2665"
}
.entypo-heart-empty:before {
content: "\2661"
}
.entypo-star:before {
content: "\2605"
}
.entypo-star-empty:before {
content: "\2606"
}
.entypo-user:before {
content: "\f007"
}
.entypo-users:before {
content: "\1f465"
}
.entypo-user-add:before {
content: "\e700"
}
.entypo-video:before {
content: "\1f3ac"
}
.entypo-picture:before {
content: "\1f304"
}
.entypo-camera:before {
content: "\1f4f7"
}
.entypo-layout:before {
content: "\268f"
}
.entypo-menu:before {
content: "\2630"
}
.entypo-check:before {
content: "\2713"
}
.entypo-cancel:before {
content: "\2715"
}
.entypo-cancel-circled:before {
content: "\2716"
}
.entypo-cancel-squared:before {
content: "\274e"
}
.entypo-plus:before {
content: "\2b"
}
.entypo-plus-circled:before {
content: "\2795"
}
.entypo-plus-squared:before {
content: "\229e"
}
.entypo-minus:before {
content: "\2d"
}
.entypo-minus-circled:before {
content: "\2796"
}
.entypo-minus-squared:before {
content: "\229f"
}
.entypo-help:before {
content: "\2753"
}
.entypo-help-circled:before {
content: "\e704"
}
.entypo-info:before {
content: "\2139"
}
.entypo-info-circled:before {
content: "\e705"
}
.entypo-back:before {
content: "\1f519"
}
.entypo-home:before {
content: "\2302"
}
.entypo-link:before {
content: "\1f517"
}
.entypo-attach:before {
content: "\1f4ce"
}
.entypo-lock:before {
content: "\1f512"
}
.entypo-lock-open:before {
content: "\1f513"
}
.entypo-eye:before {
content: "\e70a"
}
.entypo-tag:before {
content: "\e70c"
}
.entypo-bookmark:before {
content: "\1f516"
}
.entypo-bookmarks:before {
content: "\1f4d1"
}
.entypo-flag:before {
content: "\2691"
}
.entypo-thumbs-up:before {
content: "\1f44d"
}
.entypo-thumbs-down:before {
content: "\1f44e"
}
.entypo-download:before {
content: "\1f4e5"
}
.entypo-upload:before {
content: "\1f4e4"
}
.entypo-upload-cloud:before {
content: "\e711"
}
.entypo-reply:before {
content: "\e712"
}
.entypo-reply-all:before {
content: "\e713"
}
.entypo-forward:before {
content: "\27a6"
}
.entypo-quote:before {
content: "\275e"
}
.entypo-code:before {
content: "\e714"
}
.entypo-export:before {
content: "\e715"
}
.entypo-pencil:before {
content: "\270e"
}
.entypo-feather:before {
content: "\2712"
}
.entypo-print:before {
content: "\e716"
}
.entypo-retweet:before {
content: "\e717"
}
.entypo-keyboard:before {
content: "\2328"
}
.entypo-comment:before {
content: "\f044"
}
.entypo-chat:before {
content: "\e720"
}
.entypo-bell:before {
content: "\1f514"
}
.entypo-attention:before {
content: "\26a0"
}
.entypo-alert:before {
content: "\1f4a5'"
}
.entypo-vcard:before {
content: "\e722"
}
.entypo-address:before {
content: "\e723"
}
.entypo-location:before {
content: "\e724"
}
.entypo-map:before {
content: "\e727"
}
.entypo-direction:before {
content: "\27a2"
}
.entypo-compass:before {
content: "\e728"
}
.entypo-cup:before {
content: "\2615"
}
.entypo-trash:before {
content: "\e729"
}
.entypo-doc:before {
content: "\e730"
}
.entypo-docs:before {
content: "\e736"
}
.entypo-doc-landscape:before {
content: "\e737"
}
.entypo-doc-text:before {
content: "\1f4c4"
}
.entypo-doc-text-inv:before {
content: "\e731"
}
.entypo-newspaper:before {
content: "\1f4f0"
}
.entypo-book-open:before {
content: "\1f4d6"
}
.entypo-book:before {
content: "\1f4d5"
}
.entypo-folder:before {
content: "\1f4c1"
}
.entypo-archive:before {
content: "\e738"
}
.entypo-box:before {
content: "\1f4e6"
}
.entypo-rss:before {
content: "\e73a"
}
.entypo-phone:before {
content: "\1f4dE"
}
.entypo-cog:before {
content: "\2699"
}
.entypo-tools:before {
content: "\2692"
}
.entypo-share:before {
content: "\e73c"
}
.entypo-shareable:before {
content: "\e73e"
}
.entypo-basket:before {
content: "\e73d"
}
.entypo-bag:before {
content: "\1f45c'"
}
.entypo-calendar:before {
content: "\1f4c5"
}
.entypo-login:before {
content: "\e740"
}
.entypo-logout:before {
content: "\e741"
}
.entypo-mic:before {
content: "\1f3a4"
}
.entypo-mute:before {
content: "\1f507"
}
.entypo-sound:before {
content: "\1f50a"
}
.entypo-volume:before {
content: "\e742"
}
.entypo-clock:before {
content: "\1f554"
}
.entypo-hourglass:before {
content: "\23f3"
}
.entypo-lamp:before {
content: "\1f4a1"
}
.entypo-light-down:before {
content: "\1f505"
}
.entypo-light-up:before {
content: "\1f506"
}
.entypo-adjust:before {
content: "\25d1"
}
.entypo-block:before {
content: "\1f6ab"
}
.entypo-resize-full:before {
content: "\e744"
}
.entypo-resize-small:before {
content: "\e746"
}
.entypo-popup:before {
content: "\e74c"
}
.entypo-publish:before {
content: "\e74d"
}
.entypo-window:before {
content: "\e74e"
}
.entypo-arrow-combo:before {
content: "\e74f"
}
.entypo-down-circled:before {
content: "\e758"
}
.entypo-left-circled:before {
content: "\e759"
}
.entypo-right-circled:before {
content: "\e75a"
}
.entypo-up-circled:before {
content: "\e75b"
}
.entypo-down-open:before {
content: "\e75c"
}
.entypo-left-open:before {
content: "\e75d"
}
.entypo-right-open:before {
content: "\e75e"
}
.entypo-up-open:before {
content: "\e75f"
}
.entypo-down-open-mini:before {
content: "\e760"
}
.entypo-left-open-mini:before {
content: "\e761"
}
.entypo-right-open-mini:before {
content: "\e762"
}
.entypo-up-open-mini:before {
content: "\e763"
}
.entypo-down-open-big:before {
content: "\e764"
}
.entypo-left-open-big:before {
content: "\e765"
}
.entypo-right-open-big:before {
content: "\e766"
}
.entypo-up-open-big:before {
content: "\e767"
}
.entypo-down:before {
content: "\2b07"
}
.entypo-left:before {
content: "\2b05"
}
.entypo-right:before {
content: "\27a1"
}
.entypo-up:before {
content: "\2b06"
}
.entypo-down-dir:before {
content: "\25be"
}
.entypo-left-dir:before {
content: "\25c2"
}
.entypo-right-dir:before {
content: "\25b8"
}
.entypo-up-dir:before {
content: "\25b4"
}
.entypo-down-bold:before {
content: "\e4b0"
}
.entypo-left-bold:before {
content: "\e4ad"
}
.entypo-right-bold:before {
content: "\e4ae"
}
.entypo-up-bold:before {
content: "\e4af"
}
.entypo-down-thin:before {
content: "\2193"
}
.entypo-left-thin:before {
content: "\2190"
}
.entypo-right-thin:before {
content: "\2192"
}
.entypo-up-thin:before {
content: "\2191"
}
.entypo-ccw:before {
content: "\27f2"
}
.entypo-cw:before {
content: "\27f3"
}
.entypo-arrows-ccw:before {
content: "\1f504"
}
.entypo-level-down:before {
content: "\21b3"
}
.entypo-level-up:before {
content: "\21b0"
}
.entypo-shuffle:before {
content: "\1f500"
}
.entypo-loop:before {
content: "\1f501"
}
.entypo-switch:before {
content: "\21c6"
}
.entypo-play:before {
content: "\25b6"
}
.entypo-stop:before {
content: "\25a0"
}
.entypo-pause:before {
content: "\2389"
}
.entypo-record:before {
content: "\26ab"
}
.entypo-to-end:before {
content: "\23ed"
}
.entypo-to-start:before {
content: "\23ee"
}
.entypo-fast-forward:before {
content: "\23e9"
}
.entypo-fast-backward:before {
content: "\23ea"
}
.entypo-progress-0:before {
content: "\e768"
}
.entypo-progress-1:before {
content: "\e769"
}
.entypo-progress-2:before {
content: "\e76a"
}
.entypo-progress-3:before {
content: "\e76b"
}
.entypo-target:before {
content: "\1f3af"
}
.entypo-palette:before {
content: "\1f3a8"
}
.entypo-list:before {
content: "\e005"
}
.entypo-list-add:before {
content: "\e003"
}
.entypo-signal:before {
content: "\1f4f6"
}
.entypo-trophy:before {
content: "\1f3c6"
}
.entypo-battery:before {
content: "\1f50b"
}
.entypo-back-in-time:before {
content: "\e771"
}
.entypo-monitor:before {
content: "\1f4bb"
}
.entypo-mobile:before {
content: "\f095"
}
.entypo-position:before {
content: " \f041"
}
.entypo-uplad:before {
content: "\f093"
}
.entypo-network:before {
content: "\e776"
}
.entypo-cd:before {
content: "\1f4bf"
}
.entypo-inbox:before {
content: "\e777"
}
.entypo-install:before {
content: "\e778"
}
.entypo-globe:before {
content: "\1f30e"
}
.entypo-cloud:before {
content: "\2601"
}
.entypo-cloud-thunder:before {
content: "\26c8"
}
.entypo-flash:before {
content: "\26a1"
}
.entypo-moon:before {
content: "\263d"
}
.entypo-flight:before {
content: "\2708"
}
.entypo-paper-plane:before {
content: "\e79b"
}
.entypo-leaf:before {
content: "\1f342"
}
.entypo-lifebuoy:before {
content: "\e788"
}
.entypo-mouse:before {
content: "\e789"
}
.entypo-briefcase:before {
content: "\1f4bc"
}
.entypo-suitcase:before {
content: "\e78e"
}
.entypo-dot:before {
content: "\e78b"
}
.entypo-dot-2:before {
content: "\e78c"
}
.entypo-dot-3:before {
content: "\e78d"
}
.entypo-brush:before {
content: "\e79a"
}
.entypo-magnet:before {
content: "\e7a1"
}
.entypo-infinity:before {
content: "\221e"
}
.entypo-erase:before {
content: "\232b"
}
.entypo-chart-pie:before {
content: "\e751"
}
.entypo-chart-line:before {
content: "\1f4c8"
}
.entypo-chart-bar:before {
content: "\1f4ca"
}
.entypo-chart-area:before {
content: "\1f53e"
}
.entypo-tape:before {
content: "\2707"
}
.entypo-graduation-cap:before {
content: "\1f393"
}
.entypo-language:before {
content: "\e752"
}
.entypo-ticket:before {
content: "\1f3ab"
}
.entypo-water:before {
content: "\1f4a6"
}
.entypo-droplet:before {
content: "\1f4a7"
}
.entypo-air:before {
content: "\e753"
}
.entypo-credit-card:before {
content: "\1f4b3"
}
.entypo-floppy:before {
content: "\1f4be"
}
.entypo-clipboard:before {
content: "\1f4cb"
}
.entypo-megaphone:before {
content: "\1f4e3"
}
.entypo-database:before {
content: "\e754"
}
.entypo-drive:before {
content: "\e755"
}
.entypo-bucket:before {
content: "\e756"
}
.entypo-thermometer:before {
content: "\e757"
}
.entypo-key:before {
content: "\1f511"
}
.entypo-flow-cascade:before {
content: "\e790"
}
.entypo-flow-branch:before {
content: "\e791"
}
.entypo-flow-tree:before {
content: "\e792"
}
.entypo-flow-line:before {
content: "\e793"
}
.entypo-flow-parallel:before {
content: "\e794"
}
.entypo-rocket:before {
content: "\1f680"
}
.entypo-gauge:before {
content: "\e7a2"
}
.entypo-traffic-cone:before {
content: "\e7a3"
}
.entypo-cc:before {
content: "\e7a5"
}
.entypo-cc-by:before {
content: "\e7a6"
}
.entypo-cc-nc:before {
content: "\e7a7"
}
.entypo-cc-nc-eu:before {
content: "\e7a8"
}
.entypo-cc-nc-jp:before {
content: "\e7a9"
}
.entypo-cc-sa:before {
content: "\e7aa"
}
.entypo-cc-nd:before {
content: "\e7ab"
}
.entypo-cc-pd:before {
content: "\e7ac"
}
.entypo-cc-zero:before {
content: "\e7ad"
}
.entypo-cc-share:before {
content: "\e7ae"
}
.entypo-cc-remix:before {
content: "\e7af"
}
.entypo-github:before {
content: "\f300"
}
.entypo-github-circled:before {
content: "\f301"
}
.entypo-flickr:before {
content: "\f303"
}
.entypo-flickr-circled:before {
content: "\f304"
}
.entypo-vimeo:before {
content: "\f306"
}
.entypo-vimeo-circled:before {
content: "\f307"
}
.entypo-twitter:before {
content: "\f309"
}
.entypo-twitter-circled:before {
content: "\f30a"
}
.entypo-facebook:before {
content: "\f30c"
}
.entypo-facebook-circled:before {
content: "\f30d"
}
.entypo-facebook-squared:before {
content: "\f30e"
}
.entypo-gplus:before {
content: "\f30f"
}
.entypo-gplus-circled:before {
content: "\f310"
}
.entypo-pinterest:before {
content: "\f312"
}
.entypo-pinterest-circled:before {
content: "\f313"
}
.entypo-tumblr:before {
content: "\f315"
}
.entypo-tumblr-circled:before {
content: "\f316"
}
.entypo-linkedin:before {
content: "\f318"
}
.entypo-linkedin-circled:before {
content: "\f319"
}
.entypo-dribbble:before {
content: "\f31b"
}
.entypo-dribbble-circled:before {
content: "\f31c"
}
.entypo-stumbleupon:before {
content: "\f31e"
}
.entypo-stumbleupon-circled:before {
content: "\f31f"
}
.entypo-lastfm:before {
content: "\f321"
}
.entypo-lastfm-circled:before {
content: "\f322"
}
.entypo-rdio:before {
content: "\f324"
}
.entypo-rdio-circled:before {
content: "\f325"
}
.entypo-spotify:before {
content: "\f327"
}
.entypo-spotify-circled:before {
content: "\f328"
}
.entypo-qq:before {
content: "\f32a"
}
.entypo-instagrem:before {
content: "\f32d"
}
.entypo-dropbox:before {
content: "\f330"
}
.entypo-evernote:before {
content: "\f333"
}
.entypo-flattr:before {
content: "\f336"
}
.entypo-skype:before {
content: "\f339"
}
.entypo-skype-circled:before {
content: "\f33a"
}
.entypo-renren:before {
content: "\f33c"
}
.entypo-sina-weibo:before {
content: "\f33f"
}
.entypo-paypal:before {
content: "\f342"
}
.entypo-picasa:before {
content: "\f345"
}
.entypo-soundcloud:before {
content: "\f348"
}
.entypo-mixi:before {
content: "\f34b"
}
.entypo-behance:before {
content: "\f34e"
}
.entypo-google-circles:before {
content: "\f351"
}
.entypo-vkontakte:before {
content: "\f354"
}
.entypo-smashing:before {
content: "\f357"
}
.entypo-sweden:before {
content: "\f601"
}
.entypo-db-shape:before {
content: "\f600"
}
.entypo-logo-db:before {
content: "\f603"
}
[class*="entypo-"]:before {
font-family: 'FontAwesome', sans-serif;
}
/* ==================
2. ITEM RESET
================== */
#slick * {
outline: 0;
font-weight: normal;
font-style: normal;
font-size: 100%;
vertical-align: baseline;
line-height: normal;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
#slick label {
cursor: pointer;
}
#slick input[type="radio"], #slick input[type="checkbox"] {
display: none;
visibility: hidden;
opacity: 0;
}
#slick a {
text-decoration: none;
}
#slick {
width: 100%; /* <-- Adjust this value to change the width of the forms */
position: relative;
float: left;
}
/* === Note === If you experience issues with reset above, please adjust the selectors and values according to your template/website.
When adjusting the reset is adviced to check up the elements on your page, as they might distort. */
/* ==================
3. MAIN STYLES
================== */
#slick .contact-form {
position: relative;
width: 100%;
height: auto;
float: left;
padding: 40px;
}
#slick .w-100, #slick .w-47, #slick .w-30 {
float: left;
display: inline-block;
position: relative;
}
#slick .w-100 {
width: 100%;
}
#slick .w-47 {
width: 47%;
}
#slick .w-30 {
width: 30%;
}
#slick .mr-5 {
margin-right: 5%;
}
#slick .mr-6 {
margin-right: 6%;
}
#slick .mt-5 {
margin-top: 5px;
}
#slick .mt-10 {
margin-top: 10px;
}
#slick .mt-20 {
margin-top: 20px;
}
#slick .clrfx {
clear: both;
display: block;
width: 100%;
float: left;
}
#slick .clrfx.map-div {
border-bottom: solid 1px #ddd;
margin: 10px 0 6px 0;
}
/***** Google maps *****/
#slick .map {
display: inline-block;
float: left;
width: 100%;
height: 397px;
}
#slick .map-wrap {
padding: 14px;
width: 260px;
}
#slick .map-wrap .b-title {
font-size: 14px;
text-transform: uppercase;
color: #FF2424;
padding-bottom: 4px;
display: block;
width: 100%;
}
#slick .map-wrap p {
display: block;
clear: both;
font-size: 12px;
color: #999;
padding-bottom: 4px;
}
#slick .map-wrap .b-info {
font-size: 11px;
color: #333;
display: inline-block;
float: left;
margin-top: 12px;
}
#slick .map-wrap .b-info span {
padding-right: 6px;
}
/* ==================
4. TEXT ELEMENTS
================== */
/***** Headings *****/
#slick .title {
font-weight: normal;
font-size: 32px;
color: #333;
line-height: normal;
text-align: center;
}
/***** Paragraphs *****/
#slick p.intro {
font-size: 12px;
line-height: 16px;
display: block;
color: #bbb;
margin: 20px 0;
text-align: center;
clear: both;
width: 100%;
}
#slick p.intro b {
color: #1F0087;
}
#slick p.tick-text {
font-size: 10px;
color: #999;
display: inline-block;
float: left;
margin: 8px 0 0 10px;
}
/***** Tooltip *****/
#slick span.slick-tip {
width: auto;
height: auto;
white-space: nowrap;
padding: 10px;
font-size: 10px;
text-align: center;
color: #fff;
background: #D2AF3F;
position: absolute;
opacity: 0;
visibility: hidden;
z-index: -1;
}
#slick span.slick-tip.right {
right: -30px;
bottom: 36px;
background: #D1AD48;
color: #FFF;
}
#slick span.slick-tip.left {
left: 20px;
top: -44px;
}
#slick span.slick-tip:before {
content: "";
position: absolute;
bottom: -6px;
width: 0;
height: 0;
border-left: 10px solid transparent;
border-right: 10px solid transparent;
border-top: 6px solid #D1AD44;
}
#slick span.slick-tip.right:before {
right: 30px;
margin-left: -10px;
}
#slick span.slick-tip.right:before {
border-top: 6px solid rgba(255,255,255,1);
}
#slick span.slick-tip.left:before {
left: 20px;
margin-right: -10px;
}
#slick input:focus ~ .slick-tip, #slick select:focus ~ .slick-tip, #slick textarea:focus ~ .slick-tip, #slick .sb a:hover span.slick-tip {
opacity: 1;
visibility: visible;
z-index: 9999;
}
#slick input:required:valid ~ .slick-tip, #slick textarea:required:valid ~ .slick-tip {
opacity: 0;
visibility: hidden;
z-index: -1;
}
/***** Social icons *****/
#slick .sb {
position: absolute;
bottom: 0;
right: 40px;
z-index: 999;
}
#slick .sb a {
background: #ddd;
color: #fff;
font-size: 11px;
text-align: center;
display: inline-block;
margin-left: 1px;
position: relative;
width: 24px;
height: 24px;
line-height: 24px;
}
#slick .sb a.fb:hover {
background: #3B5998;
}
#slick .sb a.tw:hover {
background: #4099FF;
}
#slick .sb a.gc:hover {
background: #dd4b39;
}
/* ==================
5. INPUTS
================== */
/***** Main *****/
#slick .field {
position: relative;
width: 100%;
clear: both;
float: left;
margin-bottom: 20px;
}
#slick .field span.icon {
position: absolute;
top: 0;
left: 0;
color: #fff;
background: #8269C0 none repeat scroll 0% 0%;
font-size: 16px;
line-height: 40px;
text-align: center;
width: 38px;
height: 100%;
}
#slick .field input, #slick .field textarea, #slick .field select {
padding: 12px 20px 10px 50px;
width: 100%;
float: left;
color: #333;
font-size: 12px;
border: solid 1px #ddd;
}
#slick .field textarea {
max-height: 146px;
height: 146px;
resize: none;
overflow: auto;
}
#slick .field textarea.message {
height: 130px;
}
#slick .field textarea:focus {
}
#slick .field > input:hover, #slick .field > input:focus, #slick .field > select:hover, #slick .field > select:focus, #slick .field > textarea:hover, #slick .field > textarea:focus {
border: solid 1px #D2AF3F;
outline: none;
}
#slick input:hover ~ span.icon, #slick input:focus ~ span.icon, #slick select:hover ~ span.icon, #slick select:focus ~ span.icon, #slick textarea:hover ~ span.icon, #slick textarea:focus ~ span.icon {
outline: none;
background: #D2AF3F;
}
/***** Select input *****/
#slick .field select {
background: none;
background-color: rgba(0,0,0,0);
height: auto;
z-index: 2;
padding-left: 47px;
cursor: pointer;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
}
#slick select.grayed {
color: #999;
}
#arrow-select, #arrow-select-svg {
background: #fff;
width: 44px;
height: 35px;
position: absolute;
right: 1px;
top: 1px;
pointer-events: none;
vertical-align: middle;
outline: none;
border: none;
z-index: 3;
}
#slick select:hover ~ #arrow-select, #slick select:focus ~ #arrow-select, #slick select:hover ~ #arrow-select-svg, #slick select:focus ~ #arrow-select-svg {
background: #fff;
}
x:-o-prefocus, #arrow-select {
display: none; /* <-- Hack for Opera 12 */
}
/***** Placeholders *****/
/*-- Webkit --*/
#slick input::-webkit-input-placeholder, #slick textarea::-webkit-input-placeholder {
color: #999;
}
#slick input:focus::-webkit-input-placeholder, #slick textarea:focus::-webkit-input-placeholder {
color: #ccc;
}
/*-- Firefox 19 down --*/
#slick input:-moz-placeholder, #slick textarea:-moz-placeholder {
color: #999;
}
#slick input:focus:-moz-placeholder, #slick textarea:focus:-moz-placeholder {
color: #ccc;
}
/*-- Firefox 19 up --*/
#slick input::-moz-placeholder, #slick textarea::-moz-placeholder {
color: #999;
}
#slick input:focus::-moz-placeholder, #slick textarea:focus::-moz-placeholder {
color: #ccc;
}
/*-- IE 10+ --*/
#slick input:-ms-input-placeholder, #slick textarea:-ms-input-placeholder {
color: #999;
}
#slick input:focus:-ms-input-placeholder, #slick textarea:focus:-ms-input-placeholder {
color: #ccc;
}
/*-- IE 9 --*/
#slick .ie9-placeholder {
color: #999 !important;
}
#slick .ie9-placeholder:focus {
color: #ccc !important;
}
/***** Validations *****/
#slick .field input:required, #slick .field textarea:required, #slick .field select:required {
background:rgba(255, 255, 255, 0.32);
outline: none;
box-shadow: none;
}
#phone:hover {
background:#FFF;
outline: none;
box-shadow: none;
}
#phone {
background:rgba(255, 255, 255, 0.32);
outline: none;
box-shadow: none;
}
#slick .field input:hover:invalid, #slick .field textarea:hover:invalid, #slick .field select:hover:invalid {
background:rgba(255, 255, 255, 0.32);
outline: none;
box-shadow: none;
}
#slick .field input:required:valid, #slick .field textarea:required:valid, #slick .field select:required:valid {
background: #fff;
outline: none;
box-shadow: none;
}
#slick .field input:focus:invalid, #slick .field textarea:focus:invalid, #slick .field select:focus:invalid {
background: #fff;
outline: none;
box-shadow: none;
}
/***** Send button *****/
#slick input.send {
display: inline-block;
background: #8269C0 none repeat scroll 0% 0%;
text-transform: uppercase;
border-color: #967AE2;
text-align: center;
font-size: 12px;
color: #fff;
width: auto;
padding: 6px 28px;
border: none;
outline: none;
float: right;
clear: none;
}
#slick input.send:hover, #slick input.send:focus {
border: none;
outline: none;
background: #333;
cursor: pointer;
}
/***** Tick checkboxes *****/
#slick label.tick {
width: auto;
position: relative;
display: inline-block;
float: left;
}
#slick label.tick:before {
position: absolute;
display: inline-block;
content: "";
width: 16px;
height: 16px;
background: #fff;
border: solid 2px #ddd;
}
#slick label.tick:after {
opacity: 0;
visibility: hidden;
content: "";
position: absolute;
width: 8px;
height: 4px;
background: transparent;
top: 6px;
left: 5px;
border: 2px solid #333;
border-top: none;
border-right: none;
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
-o-transform: rotate(-45deg);
transform: rotate(-45deg);
}
#slick input:checked + label.tick:after {
opacity: 1;
visibility: visible;
}
#slick label.tick span {
font-size: 11px;
color: #999;
padding-left: 26px;
}
#slick label.tick:hover span {
color: #333;
}
/* ==================
6. TRANSITIONS
================== */
#slick a, #slick label, #slick input, #slick select, #slick textarea, #slick span.slick-tip, #slick input ~ span.icon, #slick select ~ span.icon, #slick textarea ~ span.icon {
-webkit-transition: all 0.2s ease;
-moz-transition: all 0.2s ease;
-ms-transition: all 0.2s ease;
-o-transition: all 0.2s ease;
transition: all 0.2s ease;
}
.c_h {
float: left;
width: 280px;
color: #5F40A8;
font-size: 17px !important;
margin: 0 15px 0 0 !important;
}
.c_h1 {
float: left;
width: 221px;
color: #5F40A8;
font-size: 17px !important;
margin: 0 15px 0 0 !important;
}
.cb .cIn .c_h2 {
font-size: 14px !important;
}
.c_h2 {
padding-top: 0px;
}
.cIn {
margin-bottom: 0px;
}
.cb h2 {
font-size: 18px;
font-weight: 700;
color: #000;
text-transform: uppercase;
border-bottom: #e5e5e5 solid 1px !important;
padding-bottom: 10px !important;
margin-bottom: 20px !important;
}
.cb .cIn .c_h {
}
.c_h2 {
overflow: hidden;
}
.cb h2 span {
color: #888888;
font-weight: 400;
}
.cb h2 {
font-size: 18px;
font-weight: 700;
color: #000;
text-transform: uppercase;
border-bottom: #e5e5e5 solid 1px;
padding-bottom: 10px;
margin-bottom: 20px;
}
.content-contact .icon {
margin-top: -10px;
}
.content-contact .icon {
height: 41px;
margin-bottom: 20px;
}
.content-contact .key {
font-size: 18px;
font-weight: bold;
margin-bottom: 8px;
text-transform: uppercase;
}
.content-contact {
text-align: left;
padding-top: 4px;
padding-bottom: 0px;
}
.content-contact .val {
font-size: 18px;
font-weight: 300;
margin-bottom: -10px;
}
.right-row-border .content-contact {
border-left: 1px solid #818181;
}
.c_h3 {
float: left;
width: 53px;
color: #8269C0;
font-size: 17px !important;
margin: -3px 8px 0px 0px !important;
}
#back-top {
position: fixed;
bottom: 0px;
right: 20px;
}
#back-top a {
width: 20px;
display: block;
text-align: center;
font: 11px/100% Arial, Helvetica, sans-serif;
text-transform: uppercase;
text-decoration: none;
color: #bbb;
/* background color transition */
-webkit-transition: 1s;
-moz-transition: 1s;
transition: 1s;
}
#back-top a:hover {
color: #000;
}
/* arrow icon (span tag) */
#back-top span {
width: 35px;
height: 35px;
display: block;
margin-bottom: 7px;
background: #4D2A9E url(../Images/up-arrow.png)no-repeat center center;
/* rounded corners */
-webkit-border-radius: 40px;
-moz-border-radius: 40px;
border-radius: 40px;
/* background color transition */
-webkit-transition: 1s;
-moz-transition: 1s;
transition: 1s;
}
#back-top a:hover span {
background-color: #777;
}
#portfolio .portfolio-item .portfolio-item-inner {
cursor: pointer;
}
.smallscroll {
position: absolute;
cursor: pointer;
text-align: center;
z-index: 1111;
font-size: 40px;
color: #FFF;
right: 50%;
border: 1px solid !important;
top: 37pc;
border-radius: 31px;
background: rgb(77, 46, 158) none repeat scroll 0% 0%;
}
/*tab section bottom*/
.nav > li > a:hover, .nav > li > a:focus {
text-decoration: none;
background-color: #FFF;
}
.nav-pills > li.active > a, .nav-pills > li.active > a:hover, .nav-pills > li.active > a:focus {
color: #FFF;
background-color: #8269C0;
}
.nav-pills > li {
outline: 1px solid #8269C0;
}
.nav > li > a {
font-weight: 700;
color: #8269C0;
}
.nav-pills > li > a {
border-radius: 0px !important;
}
#caeers {
padding: 100px 0px 50px;
}
/*responsive table*/
table {
width: 100%;
border-collapse: collapse;
}
/* Zebra striping */
th {
color: #6146AA;
font-weight: bold;
}
td, th {
padding: 6px;
border: 1px solid #ccc;
text-align: left;
}
.myth {
width: 23%;
}
.mybtnnew {
padding: 8px;
margin-top: 0;
float: right;
}
/*contenet */
.carousel-content {
background: rgba(0, 0, 0, 0.28);
padding-bottom: 20px;
padding-left: 20px;
padding-right: 20px;
width: 81% !important;
border-radius: 24px;
}
.mynewp {
padding-left: 10px;
font-size: 17px !important;
line-height: 21px;
}
.navbar-default {
z-index: 11111;
}
/*newtab*/
.thumbnail {
padding: 0 0 15px 0 !important;
}
/*product*/
#product {
padding: 42px 0;
background: url(../../Images/work-process/bg-one.jpg);
background-size: cover;
}
.product-btn {
position: relative;
z-index: 2;
top: 41px;
display: block;
width: 60%;
margin: 0px auto;
}
.newimgspan img {
height: 500px;
}
.project img {
border-radius: 10px
}
.close-project {
text-align: center;
font-size: 38px;
background: #6448AC;
width: 45px;
margin: 0px auto;
border-radius: 50%;
height: 43px;
LINE-HEIGHT: 42px;
color: #FFF;
cursor: pointer;
}
/*.loader {
position: fixed !important;
left: 0px !important;
top: 0px !important;
width: 100% !important;
height: 100% !important;
z-index: 9999 !important;
background:url('../images/main-logo.gif') 50% 50% no-repeat #FFF;
z-index:11111111;
}*/
input[type="range" i] {
-webkit-appearance: slider-horizontal;
padding: initial;
border: initial;
margin: 2px;
}
audio::-webkit-media-controls-timeline, video::-webkit-media-controls-timeline {
background:#63C;
-webkit-background:#63C;
-webkit-appearance-background:#63C;
-o-background:#63C;
-ms-background:#63C;
-moz-background:#63C;
}
.controls progress {
background: #F30;
}
.carousel-control {
width: 3% !important;
top: 50% !important;
font-size: 57px !important;
color: #D2AC47 !important;
}
.carousel-control .glyphicon-chevron-left, .carousel-control .glyphicon-chevron-right, .carousel-control .icon-prev, .carousel-control .icon-next {
font-size: 20px !important;
}
.carousel-control.right {
-webkit-background-image: none !important;
-ms-background-image: none !important;
-o-background-image: none !important;
-moz-background-image: none !important;
background:#000!important;
color:#fff!important;
}
.carousel-control.left {
background-image: none !important;
-webkit-background-image: none !important;
-ms-background-image: none !important;
-o-background-image: none !important;
-moz-background-image: none !important;
}
/* corporate*/
.newspan {
color: #727272;
font-size: 19px;
font-weight: 600
}
.column-title-one {
margin-top: 0px;
padding-bottom: 15px;
border-bottom: 1px solid #ccc;
margin-bottom: 15px;
position: relative;
font-family: "Abel",sans-serif;
font-size:30px;
}
.column-title-one:after {
content: " ";
position: absolute;
bottom: -1px;
left: 0px;
width: 15%;
}
.panel-default > .panel-heading {
background:rgba(151, 151, 151, 0.90);
color: #FFF;
}
.panel-default > .panel-heading:hover {
color: #FFF;
}
.panel-default > .panel-heading + .panel-collapse > .panel-body {
border:1px solid rgba(151, 151, 151, 0.90);
}
@media (min-width: 768px) {
.nav-justified>li {
display: table-cell;
width: 371px !important;
}
}
#owl-demo .item {
margin: 3px;
}
#owl-demo .item img {
display: block;
width: 100%;
height: auto;
}
.morph-button-modal-1 > button, .morph-button-modal-1 .morph-content {
background: transparent!important;
border: 1px solid #8269C0!important;
border-radius: 100px;
color: #8269C0!important;
font-size: 1.5em !important;
}
.myhover span i{
font-size:2em;
position:relative;
top:6px;
}
.morph-button-modal-1 > button:hover {
background-color: transparent!important;
border: 1px solid #D5AC46 !important;
border: 1px solid #D5AC46 !important;
color:#D5AC46!important;
}
.content-style-text p {
color: #666!important;
}
h2, .h2 {
font-size: 27px !important;
}
.carousel {
margin-bottom: 0;
padding: 0 40px 30px 40px;
}
.back-to-top {
cursor: pointer;
position: fixed;
bottom: 20px;
right: 20px;
display: none;
}
.scroll-top-wrapper {
position: fixed;
opacity: 0;
overflow: hidden;
text-align: center;
z-index: 99999999;
background-color: #8269C0;
color: #eeeeee;
width: 50px;
height: 48px;
line-height: 48px;
right: 20px;
bottom: 20px;
padding-top: 2px;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
border-bottom-right-radius: 10px;
border-bottom-left-radius: 10px;
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
}
.scroll-top-wrapper:hover {
background-color: #888888;
}
.scroll-top-wrapper.show {
visibility: visible;
cursor: pointer;
opacity: 1.0;
}
.scroll-top-wrapper i.fa {
line-height: inherit;
}
/*SOCIAL*/
.material-button-anim {
position: fixed;
bottom: 1%;
left: -15px;
padding: 10px 10px 27px;
text-align: center;
max-width: 320px;
z-index: 11111;
}
.material-button {
position: relative;
top: 0;
z-index: 1;
width: 50px;
height: 50px;
font-size: 1.5em;
color: #fff;
background: #8269C0;
border: none;
border-radius: 50%;
box-shadow: 0 3px 6px rgba(0,0,0,.275);
outline: none;
}
.material-button-toggle {
z-index: 311111;
width: 50px;
height: 50px;
margin: 0 auto;
}
.material-button-toggle span {
position: relative;
z-index: 999;
-webkit-transition: all .5s ease-in-out;
transition: all .5s ease-in-out;
-webkit-transform: none;
transform: none;
-webkit-transition: -webkit-transform .175s cubic-bazier(.175, .67, .83, .67);
transition: transform .175s cubic-bazier(.175, .67, .83, .67);
}
.material-button-toggle.open {
-webkit-transform: scale(1.3, 1.3);
transform: scale(1.3, 1.3);
-webkit-animation: toggleBtnAnim .175s;
animation: toggleBtnAnim .175s;
}
.material-button-toggle.open span {
-webkit-transform: rotate(230deg);
transform: rotate(230deg);
-webkit-transition: -webkit-transform (all.175s cubic-bazier(.175, .67, .83, .67));
transition: transform .175s cubic-bazier(.175, .67, .83, .67);
}
#options {
height: 70px;
margin-bottom: 25px;
margin-left: 0px !important;
}
.option {
position: relative;
}
.option .option1, .option .option2, .option .option3 {
filter: blur(5px);
-webkit-filter: blur(5px);
-webkit-transition: all .175s;
transition: all .175s;
}
.option .option1 {
-webkit-transform: translate3d(75px, 63px, 0px) scale(0.8, 0.8);
transform: translate3d(75px, 63px, 0px) scale(0.8, 0.8);
}
.option .option2 {
-webkit-transform: translate3d(0px, 63px, 0px) scale(0.8, 0.8);
transform: translate3d(0px, 63px, 0px) scale(0.8, 0.8);
}
.option .option3 {
-webkit-transform: translate3d(-82px, 65px, 0px) scale(0.8, 0.8);
transform: translate3d(-82px, 65px, 0px) scale(0.8, 0.8);
}
.option.scale-on .option1, .option.scale-on .option2, .option.scale-on .option3 {
filter: blur(0);
-webkit-filter: blur(0);
-webkit-transform: none;
transform: none;
-webkit-transition: all .175s;
transition: all .175s;
}
.option.scale-on .option2 {
-webkit-transform: translateY(-28px) translateZ(0);
transform: translateY(-28px) translateZ(0);
-webkit-transition: all .175s;
transition: all .175s;
}
@keyframes toggleBtnAnim {
0% {
-webkit-transform: scale(1, 1);
transform: scale(1, 1);
}
25% {
-webkit-transform: scale(1.4, 1.4);
transform: scale(1.4, 1.4);
}
75% {
-webkit-transform: scale(1.2, 1.2);
transform: scale(1.2, 1.2);
}
100% {
-webkit-transform: scale(1.3, 1.3);
transform: scale(1.3, 1.3);
}
}
@-webkit-keyframes toggleBtnAnim {
0% {
-webkit-transform: scale(1, 1);
transform: scale(1, 1);
}
25% {
-webkit-transform: scale(1.4, 1.4);
transform: scale(1.4, 1.4);
}
75% {
-webkit-transform: scale(1.2, 1.2);
transform: scale(1.2, 1.2);
}
100% {
-webkit-transform: scale(1.3, 1.3);
transform: scale(1.3, 1.3);
}
}
@keyframes bounce {
0% {
margin-top:0;
}
50% {
margin-top:-15px;
margin-bottom:15px;
}
100% {
margin-top:0;
}
}
@keyframes roket-roket-circle-anim {
0% {
transform: rotate(0deg) scale(1) skew(0deg);
opacity: 0.1;
}
30% {
transform: rotate(0deg) scale(1.25) skew(0deg);
opacity: 0.25;
}
100% {
transform: rotate(0deg) scale(1.5) skew(0deg);
opacity: 0;
}
}
.material-button-toggle:not(:hover):not(:focus):not(:active) {
transition: .25s !important;
animation: 2.25s bounce infinite !important;
}
.material-anim {
width: 100%;
height: 100%;
text-indent: -9999px;
z-index: 0;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
box-shadow: none;
}
.material-anim.one {
-webkit-animation: roket-roket-circle-anim 1.2s infinite ease-in-out !important;
-moz-animation: roket-roket-circle-anim 1.2s infinite ease-in-out !important;
-ms-animation: roket-roket-circle-anim 1.2s infinite ease-in-out !important;
-o-animation: roket-roket-circle-anim 1.2s infinite ease-in-out !important;
animation: roket-roket-circle-anim 1.2s infinite ease-in-out !important;
-webkit-transition: all 0.5s !important;
-moz-transition: all 0.5s !important;
-o-transition: all 0.5s !important;
transition: all 0.5s !important;
}
.material-anim.two {
border: 2px solid #2C98DE !important;
opacity: 0.1 !important;
background: none !important;
-webkit-animation: roket-roket-circle-anim 1.9s infinite ease-in-out !important;
-moz-animation: roket-roket-circle-anim 1.9s infinite ease-in-out !important;
-ms-animation: roket-roket-circle-anim 1.9s infinite ease-in-out !important;
-o-animation: roket-roket-circle-anim 1.9s infinite ease-in-out !important;
animation: roket-roket-circle-anim 1.9s infinite ease-in-out !important;
-webkit-transition: all 0.5s !important;
-moz-transition: all 0.5s !important;
-o-transition: all 0.5s !important;
transition: all 0.5s !important;
}
.panel-heading:hover {
cursor: pointer;
}
.panel-heading {
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.side-tab:hover {
cursor: pointer;
}
.panel.panel-default {
border: none;
box-shadow: none !important;
border-bottom-right-radius: 0px;
border-bottom-left-radius: 0px;
}
.panel-heading {
border: none;
background-color: #eee;
}
.panel-body {
color:#64686d !important;
}
.panel-title {
font-weight: 400;
color: #fff!important;
}
/*----------------------------------
Macbook pro mockup from:
http://jaredhardy.com/minimal-devices/
----------------------------------*/
.md-macbook-pro {
display: block;
width: 55.3125em;
height: 31.875em;
font-size: 13px;
margin: 0 auto;
}
@media (max-width:1199px)
{
font-size:11px;
}
@media (max-width:1024px) {
font-size:10px;
}
@media (max-width:767px) {
font-size:7px;
}
@media (max-width:320px) {
font-size: 5px;
}
}
.md-macbook-pro .md-lid {
width: 45em;
height: 30.625em;
overflow: hidden;
margin: 0 auto;
position: relative;
border-radius: 1.875em;
border: solid 0.1875em #cdced1;
background: #131313;
}
.md-macbook-pro .md-camera {
width: 0.375em;
height: 0.375em;
margin: 0 auto;
position: relative;
top: 1.0625em;
background: #000;
border-radius: 100%;
box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 0.25);
}
.md-macbook-pro .md-camera:after {
content: "";
display: block;
width: 0.125em;
height: 0.125em;
position: absolute;
left: 0.125em;
top: 0.0625em;
background: #353542;
border-radius: 100%;
}
.md-macbook-pro .md-screen {
width: 42.25em;
height: 26.375em;
margin: 0 auto;
position: relative;
top: 2.0625em;
background: #1d1d1d;
background: #fff;
overflow: hidden;
}
.md-macbook-pro .md-screen img {
width: 100%;
}
.md-macbook-pro .md-base {
width: 100%;
height: 0.9375em;
position: relative;
top: -0.75em;
background: #c6c7ca;
}
.md-macbook-pro .md-base:after {
content: "";
display: block;
width: 100%;
height: 0.5em;
margin: 0 auto;
position: relative;
bottom: -0.1875em;
background: #b9babe;
border-radius: 0 0 1.25em 1.25em;
}
.md-macbook-pro .md-base:before {
content: "";
display: block;
width: 7.6875em;
height: 0.625em;
margin: 0 auto;
position: relative;
background: #a6a8ad;
border-radius: 0 0 0.625em 0.625em;
}
.md-macbook-pro.md-glare .md-lid:after {
content: "";
display: block;
width: 50%;
height: 100%;
position: absolute;
top: 0;
right: 0;
border-radius: 0 1.25em 0 0;
background: -webkit-linear-gradient(37deg, rgba(255, 255, 255, 0) 50%, rgba(247, 248, 240, 0.025) 50%, rgba(250, 245, 252, 0.08));
background: -moz-linear-gradient(37deg, rgba(255, 255, 255, 0) 50%, rgba(247, 248, 240, 0.025) 50%, rgba(250, 245, 252, 0.08));
background: -o-linear-gradient(37deg, rgba(255, 255, 255, 0) 50%, rgba(247, 248, 240, 0.025) 50%, rgba(250, 245, 252, 0.08));
background: linear-gradient(53deg, rgba(255, 255, 255, 0) 50%, rgba(247, 248, 240, 0.025) 50%, rgba(250, 245, 252, 0.08));
}
.newmarginclass {
margin-top: 4%;
}
.myhover:hover {
background: #8269C0 !important;
color: #FFF !important;
}
.smallscroll-two {
position: absolute;
cursor: pointer;
text-align: center;
z-index: 1111;
font-size: 40px;
color: #8269C0;
right: 50%;
}
body.noscroll {
position: fixed;
overflow: hidden;
}
.smoothScroll {
position: absolute;
cursor: pointer;
text-align: center;
z-index: 1111;
font-size: 45px!important;
color: #fff;
left: 49%;
border-radius:30px;
padding:6px 14px;
background:#d5ac46;
}
.fa-angle-double-down{
font-size:30px;
}
small {
margin-left: 24px;
color: gray;
}
.material-button-toggle:hover {
background: #F93;
}
.material-button:hover {
background: #F93;
}
/*Div jump*/
.section-one {
position: relative;
bottom: 55px;
margin: 0px auto;
width: 50px;
}
.section-two {
position: relative;
top: 110px;
margin: 0px auto;
width: 50px;
}
.section-three {
position: relative;
bottom: 39px;
margin: 0px auto;
width: 50px;
}
.section-four {
position: relative;
bottom: 25px;
margin: 0px auto;
width: 50px;
}
.section-five {
position: relative;
bottom: 54px;
margin: 0px auto;
width: 50px;
}
.section-six {
position: relative;
bottom: 65px;
z-index: 1;
margin: 0px auto;
width: 50px;
}
.section-seven {
position: relative;
bottom: 48px;
margin: 0px auto;
width: 50px;
}
.panel-group .panel {
margin-top: 5px;
}
.myhovernew > a:active {
color: #fff !important;
}
.myhovernew > a:focus {
color: #fff !important;
}
.myhovernew > a:hover {
color: #fff!important;
}
.panel-heading .accordion-toggle:after {
/* symbol for "opening" panels */
font-family: 'FontAwesome'; /* essential for enabling glyphicon */
/* adjust as needed, taken from bootstrap.css */
content:"\f078";
float: right; /* adjust as needed */
/* adjust as needed */
}
.panel-heading .accordion-toggle.collapsed:after {
/* symbol for "collapsed" panels */
font-family: 'FontAwesome';
content:"\f054"; /* adjust as needed, taken from bootstrap.css */
}
#slick .contact-formnew {
position: relative;
width: 100%;
height: auto;
float: left;
padding-top:20px;
}
.newmargin {
margin-top: -35px;
}
.media-heading{
font-family: 'Roboto', sans-serif;
font-size:2.3em;
}
.media-body p{
font-size:2em;
line-height:1.4;
}
.btn.btn-readmore {
background:#8269C0!important;
color: #fff!important;
border-color:#B496FF;
padding:2px 13px!important;
float:right;
}
.btn.btn-readmore:hover, .btn.btn-readmore:focus {
background: #D1AE49!important;
color: #FFF!important;
border-color:#bd9020;
}
.drop-shadow {
position: relative;
width: 100% !important;
}
.drop-shadow:before,
.drop-shadow:after {
content: "";
position: absolute;
z-index: -1;
}
.drop-shadow:before,
.drop-shadow:after {
content: "";
position: absolute;
z-index: -1;
bottom: 15px;
left: 10px;
width: 50%;
height: 20%;
}
.drop-shadow:before,
.drop-shadow:after {
content: "";
position: absolute;
z-index: -1;
bottom: 15px;
left: 10px;
width: 50%;
height: 20%;
box-shadow: 0 15px 10px rgba(0, 0, 0, 0.7);
transform: rotate(-3deg);
}
.drop-shadow:after{
right: 10px;
left: auto;
transform: rotate(3deg);
}
.drop-shadow {
position: relative;
width: 90%;
}
.drop-shadow:before,
.drop-shadow:after {
content: "";
position: absolute;
z-index: -1;
bottom: 15px;
left: 10px;
width: 50%;
height: 20%;
max-width: 300px;
box-shadow :0 15px 10px rgba(0, 0, 0, 0.7);
transform: rotate(-3deg);
}
.drop-shadow:after{
right: 10px;
left: auto;
transform: rotate(3deg);
}
.drop-shadow {
border-radius: 0 0 120px 120px / 0 0 6px 6px;
}
.nav li a {
position:relative;
float: left;
font-family:"Abel",sans-serif;
text-align:center;
padding-top:0px;
padding-bottom:30px;
margin-right:6px;
-webkit-border-bottom-right-radius: 5px;
-webkit-border-bottom-left-radius: 5px;
-moz-border-radius-bottomright: 5px;
-moz-border-radius-bottomleft: 5px;
border-bottom-right-radius: 5px;
border-bottom-left-radius: 5px;
-webkit-transition: all .5s ease-out;
-moz-transition: all .5s ease-out;
-o-transition: all .5s ease-out;
background:#8269C0!important;
color:white!important;
font-size:16px!important;
font-weight:normal;
}
.nav li a:hover {
padding-top:27px;
padding-bottom:60px;
-webkit-transition: all .5s ease-out;
-moz-transition: all .5s ease-out;
-o-transition: all .5s ease-out;
}
.navbar-fixed-top{
box-shadow:0 0 22px 0 rgba(0, 0, 0, 0.3)!important;
}
.tabs{
list-style:none
}
.tabs li a{
background: #d4ad47 ;
border-bottom: 1px solid white;
color: #fff;
display: inline-block;
font-size: 1.3em;
line-height: 0.5;
padding: 21px 26px;
position: relative;
width: 100%;
}
/*tabs*/
.newcontent {
overflow: auto;
height: 236px;
width:831px;
}
/*
== malihu jquery custom scrollbar plugin ==
Plugin URI: http://manos.malihu.gr/jquery-custom-content-scroller
*/
/*
CONTENTS:
1. BASIC STYLE - Plugin's basic/essential CSS properties (normally, should not be edited).
2. VERTICAL SCROLLBAR - Positioning and dimensions of vertical scrollbar.
3. HORIZONTAL SCROLLBAR - Positioning and dimensions of horizontal scrollbar.
4. VERTICAL AND HORIZONTAL SCROLLBARS - Positioning and dimensions of 2-axis scrollbars.
5. TRANSITIONS - CSS3 transitions for hover events, auto-expanded and auto-hidden scrollbars.
6. SCROLLBAR COLORS, OPACITY AND BACKGROUNDS
6.1 THEMES - Scrollbar colors, opacity, dimensions, backgrounds etc. via ready-to-use themes.
*/
/*
------------------------------------------------------------------------------------------------------------------------
1. BASIC STYLE
------------------------------------------------------------------------------------------------------------------------
*/
.mCustomScrollbar{ -ms-touch-action: pinch-zoom; touch-action: pinch-zoom; /* direct pointer events to js */ }
.mCustomScrollbar.mCS_no_scrollbar, .mCustomScrollbar.mCS_touch_action{ -ms-touch-action: auto; touch-action: auto; }
.mCustomScrollBox{ /* contains plugin's markup */
position: relative;
overflow: hidden;
height: 100%;
max-width: 100%;
outline: none;
direction: ltr;
}
.mCSB_container{ /* contains the original content */
overflow: hidden;
width: auto;
height: auto;
}
/*
------------------------------------------------------------------------------------------------------------------------
2. VERTICAL SCROLLBAR
y-axis
------------------------------------------------------------------------------------------------------------------------
*/
.mCSB_inside > .mCSB_container{ margin-right: 30px; }
.mCSB_container.mCS_no_scrollbar_y.mCS_y_hidden{ margin-right: 0; } /* non-visible scrollbar */
.mCS-dir-rtl > .mCSB_inside > .mCSB_container{ /* RTL direction/left-side scrollbar */
margin-right: 0;
margin-left: 30px;
}
.mCS-dir-rtl > .mCSB_inside > .mCSB_container.mCS_no_scrollbar_y.mCS_y_hidden{ margin-left: 0; } /* RTL direction/left-side scrollbar */
.mCSB_scrollTools{ /* contains scrollbar markup (draggable element, dragger rail, buttons etc.) */
position: absolute;
width: 16px;
height: auto;
left: auto;
top: 0;
right: 0;
bottom: 0;
}
.mCSB_outside + .mCSB_scrollTools{ right: -26px; } /* scrollbar position: outside */
.mCS-dir-rtl > .mCSB_inside > .mCSB_scrollTools,
.mCS-dir-rtl > .mCSB_outside + .mCSB_scrollTools{ /* RTL direction/left-side scrollbar */
right: auto;
left: 0;
}
.mCS-dir-rtl > .mCSB_outside + .mCSB_scrollTools{ left: -26px; } /* RTL direction/left-side scrollbar (scrollbar position: outside) */
.mCSB_scrollTools .mCSB_draggerContainer{ /* contains the draggable element and dragger rail markup */
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
height: auto;
}
.mCSB_scrollTools a + .mCSB_draggerContainer{ margin: 20px 0; }
.mCSB_scrollTools .mCSB_draggerRail{
width: 7px;
height: 100%;
margin: 0 auto;
-webkit-border-radius: 16px; -moz-border-radius: 16px; border-radius: 16px;
}
.mCSB_scrollTools .mCSB_dragger{ /* the draggable element */
cursor: pointer;
width: 100%;
height: 30px; /* minimum dragger height */
z-index: 1;
}
.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ /* the dragger element */
position: relative;
width: 7px;
height: 100%;
margin: 0 auto;
-webkit-border-radius: 16px; -moz-border-radius: 16px; border-radius: 16px;
text-align: center;
}
.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,
.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar{ width: 12px; /* auto-expanded scrollbar */ }
.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail,
.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail{ width: 8px; /* auto-expanded scrollbar */ }
.mCSB_scrollTools .mCSB_buttonUp,
.mCSB_scrollTools .mCSB_buttonDown{
display: block;
position: absolute;
height: 20px;
width: 100%;
overflow: hidden;
margin: 0 auto;
cursor: pointer;
}
.mCSB_scrollTools .mCSB_buttonDown{ bottom: 0; }
/*
------------------------------------------------------------------------------------------------------------------------
3. HORIZONTAL SCROLLBAR
x-axis
------------------------------------------------------------------------------------------------------------------------
*/
.mCSB_horizontal.mCSB_inside > .mCSB_container{
margin-right: 0;
margin-bottom: 30px;
}
.mCSB_horizontal.mCSB_outside > .mCSB_container{ min-height: 100%; }
.mCSB_horizontal > .mCSB_container.mCS_no_scrollbar_x.mCS_x_hidden{ margin-bottom: 0; } /* non-visible scrollbar */
.mCSB_scrollTools.mCSB_scrollTools_horizontal{
width: auto;
height: 16px;
top: auto;
right: 0;
bottom: 0;
left: 0;
}
.mCustomScrollBox + .mCSB_scrollTools.mCSB_scrollTools_horizontal,
.mCustomScrollBox + .mCSB_scrollTools + .mCSB_scrollTools.mCSB_scrollTools_horizontal{ bottom: -26px; } /* scrollbar position: outside */
.mCSB_scrollTools.mCSB_scrollTools_horizontal a + .mCSB_draggerContainer{ margin: 0 20px; }
.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_draggerRail{
width: 100%;
height: 2px;
margin: 7px 0;
}
.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_dragger{
width: 30px; /* minimum dragger width */
height: 100%;
left: 0;
}
.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{
width: 100%;
height: 4px;
margin: 6px auto;
}
.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,
.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar{
height: 12px; /* auto-expanded scrollbar */
margin: 2px auto;
}
.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail,
.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail{
height: 8px; /* auto-expanded scrollbar */
margin: 4px 0;
}
.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonLeft,
.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonRight{
display: block;
position: absolute;
width: 20px;
height: 100%;
overflow: hidden;
margin: 0 auto;
cursor: pointer;
}
.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonLeft{ left: 0; }
.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonRight{ right: 0; }
/*
------------------------------------------------------------------------------------------------------------------------
4. VERTICAL AND HORIZONTAL SCROLLBARS
yx-axis
------------------------------------------------------------------------------------------------------------------------
*/
.mCSB_container_wrapper{
position: absolute;
height: auto;
width: auto;
overflow: hidden;
top: 0;
left: 0;
right: 0;
bottom: 0;
margin-right: 30px;
margin-bottom: 30px;
}
.mCSB_container_wrapper > .mCSB_container{
padding-right: 30px;
padding-bottom: 30px;
-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;
}
.mCSB_vertical_horizontal > .mCSB_scrollTools.mCSB_scrollTools_vertical{ bottom: 20px; }
.mCSB_vertical_horizontal > .mCSB_scrollTools.mCSB_scrollTools_horizontal{ right: 20px; }
/* non-visible horizontal scrollbar */
.mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden + .mCSB_scrollTools.mCSB_scrollTools_vertical{ bottom: 0; }
/* non-visible vertical scrollbar/RTL direction/left-side scrollbar */
.mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden + .mCSB_scrollTools ~ .mCSB_scrollTools.mCSB_scrollTools_horizontal,
.mCS-dir-rtl > .mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_scrollTools.mCSB_scrollTools_horizontal{ right: 0; }
/* RTL direction/left-side scrollbar */
.mCS-dir-rtl > .mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_scrollTools.mCSB_scrollTools_horizontal{ left: 20px; }
/* non-visible scrollbar/RTL direction/left-side scrollbar */
.mCS-dir-rtl > .mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden + .mCSB_scrollTools ~ .mCSB_scrollTools.mCSB_scrollTools_horizontal{ left: 0; }
.mCS-dir-rtl > .mCSB_inside > .mCSB_container_wrapper{ /* RTL direction/left-side scrollbar */
margin-right: 0;
margin-left: 30px;
}
.mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden > .mCSB_container{ padding-right: 0; }
.mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden > .mCSB_container{ padding-bottom: 0; }
.mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden{
margin-right: 0; /* non-visible scrollbar */
margin-left: 0;
}
/* non-visible horizontal scrollbar */
.mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden{ margin-bottom: 0; }
/*
------------------------------------------------------------------------------------------------------------------------
5. TRANSITIONS
------------------------------------------------------------------------------------------------------------------------
*/
.mCSB_scrollTools,
.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCSB_scrollTools .mCSB_buttonUp,
.mCSB_scrollTools .mCSB_buttonDown,
.mCSB_scrollTools .mCSB_buttonLeft,
.mCSB_scrollTools .mCSB_buttonRight{
-webkit-transition: opacity .2s ease-in-out, background-color .2s ease-in-out;
-moz-transition: opacity .2s ease-in-out, background-color .2s ease-in-out;
-o-transition: opacity .2s ease-in-out, background-color .2s ease-in-out;
transition: opacity .2s ease-in-out, background-color .2s ease-in-out;
}
.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger_bar, /* auto-expanded scrollbar */
.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerRail,
.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger_bar,
.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerRail{
-webkit-transition: width .2s ease-out .2s, height .2s ease-out .2s,
margin-left .2s ease-out .2s, margin-right .2s ease-out .2s,
margin-top .2s ease-out .2s, margin-bottom .2s ease-out .2s,
opacity .2s ease-in-out, background-color .2s ease-in-out;
-moz-transition: width .2s ease-out .2s, height .2s ease-out .2s,
margin-left .2s ease-out .2s, margin-right .2s ease-out .2s,
margin-top .2s ease-out .2s, margin-bottom .2s ease-out .2s,
opacity .2s ease-in-out, background-color .2s ease-in-out;
-o-transition: width .2s ease-out .2s, height .2s ease-out .2s,
margin-left .2s ease-out .2s, margin-right .2s ease-out .2s,
margin-top .2s ease-out .2s, margin-bottom .2s ease-out .2s,
opacity .2s ease-in-out, background-color .2s ease-in-out;
transition: width .2s ease-out .2s, height .2s ease-out .2s,
margin-left .2s ease-out .2s, margin-right .2s ease-out .2s,
margin-top .2s ease-out .2s, margin-bottom .2s ease-out .2s,
opacity .2s ease-in-out, background-color .2s ease-in-out;
}
/*
------------------------------------------------------------------------------------------------------------------------
6. SCROLLBAR COLORS, OPACITY AND BACKGROUNDS
------------------------------------------------------------------------------------------------------------------------
*/
/*
----------------------------------------
6.1 THEMES
----------------------------------------
*/
/* default theme ("light") */
.mCSB_scrollTools{ opacity: 0.75; filter: "alpha(opacity=75)"; -ms-filter: "alpha(opacity=75)"; }
.mCS-autoHide > .mCustomScrollBox > .mCSB_scrollTools,
.mCS-autoHide > .mCustomScrollBox ~ .mCSB_scrollTools{ opacity: 0; filter: "alpha(opacity=0)"; -ms-filter: "alpha(opacity=0)"; }
.mCustomScrollbar > .mCustomScrollBox > .mCSB_scrollTools.mCSB_scrollTools_onDrag,
.mCustomScrollbar > .mCustomScrollBox ~ .mCSB_scrollTools.mCSB_scrollTools_onDrag,
.mCustomScrollBox:hover > .mCSB_scrollTools,
.mCustomScrollBox:hover ~ .mCSB_scrollTools,
.mCS-autoHide:hover > .mCustomScrollBox > .mCSB_scrollTools,
.mCS-autoHide:hover > .mCustomScrollBox ~ .mCSB_scrollTools{ opacity: 1; filter: "alpha(opacity=100)"; -ms-filter: "alpha(opacity=100)"; }
.mCSB_scrollTools .mCSB_draggerRail{
background-color: #cdac3b; background-color: #cdac3b;
filter: "alpha(opacity=40)"; -ms-filter: "alpha(opacity=40)";
}
.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
background-color: #fff; background-color: rgba(255,255,255,0.75);
filter: "alpha(opacity=75)"; -ms-filter: "alpha(opacity=75)";
}
.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{
background-color: #fff; background-color: rgba(255,255,255,0.85);
filter: "alpha(opacity=85)"; -ms-filter: "alpha(opacity=85)";
}
.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{
background-color: #fff; background-color: rgba(255,255,255,0.9);
filter: "alpha(opacity=90)"; -ms-filter: "alpha(opacity=90)";
}
.mCSB_scrollTools .mCSB_buttonUp,
.mCSB_scrollTools .mCSB_buttonDown,
.mCSB_scrollTools .mCSB_buttonLeft,
.mCSB_scrollTools .mCSB_buttonRight{
background-image: url(mCSB_buttons.png); /* css sprites */
background-repeat: no-repeat;
opacity: 0.4; filter: "alpha(opacity=40)"; -ms-filter: "alpha(opacity=40)";
}
.mCSB_scrollTools .mCSB_buttonUp{
background-position: 0 0;
/*
sprites locations
light: 0 0, -16px 0, -32px 0, -48px 0, 0 -72px, -16px -72px, -32px -72px
dark: -80px 0, -96px 0, -112px 0, -128px 0, -80px -72px, -96px -72px, -112px -72px
*/
}
.mCSB_scrollTools .mCSB_buttonDown{
background-position: 0 -20px;
/*
sprites locations
light: 0 -20px, -16px -20px, -32px -20px, -48px -20px, 0 -92px, -16px -92px, -32px -92px
dark: -80px -20px, -96px -20px, -112px -20px, -128px -20px, -80px -92px, -96px -92px, -112 -92px
*/
}
.mCSB_scrollTools .mCSB_buttonLeft{
background-position: 0 -40px;
/*
sprites locations
light: 0 -40px, -20px -40px, -40px -40px, -60px -40px, 0 -112px, -20px -112px, -40px -112px
dark: -80px -40px, -100px -40px, -120px -40px, -140px -40px, -80px -112px, -100px -112px, -120px -112px
*/
}
.mCSB_scrollTools .mCSB_buttonRight{
background-position: 0 -56px;
/*
sprites locations
light: 0 -56px, -20px -56px, -40px -56px, -60px -56px, 0 -128px, -20px -128px, -40px -128px
dark: -80px -56px, -100px -56px, -120px -56px, -140px -56px, -80px -128px, -100px -128px, -120px -128px
*/
}
.mCSB_scrollTools .mCSB_buttonUp:hover,
.mCSB_scrollTools .mCSB_buttonDown:hover,
.mCSB_scrollTools .mCSB_buttonLeft:hover,
.mCSB_scrollTools .mCSB_buttonRight:hover{ opacity: 0.75; filter: "alpha(opacity=75)"; -ms-filter: "alpha(opacity=75)"; }
.mCSB_scrollTools .mCSB_buttonUp:active,
.mCSB_scrollTools .mCSB_buttonDown:active,
.mCSB_scrollTools .mCSB_buttonLeft:active,
.mCSB_scrollTools .mCSB_buttonRight:active{ opacity: 0.9; filter: "alpha(opacity=90)"; -ms-filter: "alpha(opacity=90)"; }
/* theme: "dark" */
.mCS-dark.mCSB_scrollTools .mCSB_draggerRail{ background-color: #000; background-color: rgba(0,0,0,0.15); }
.mCS-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.75); }
.mCS-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: rgba(0,0,0,0.85); }
.mCS-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: rgba(0,0,0,0.9); }
.mCS-dark.mCSB_scrollTools .mCSB_buttonUp{ background-position: -80px 0; }
.mCS-dark.mCSB_scrollTools .mCSB_buttonDown{ background-position: -80px -20px; }
.mCS-dark.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -80px -40px; }
.mCS-dark.mCSB_scrollTools .mCSB_buttonRight{ background-position: -80px -56px; }
/* ---------------------------------------- */
/* theme: "light-2", "dark-2" */
.mCS-light-2.mCSB_scrollTools .mCSB_draggerRail,
.mCS-dark-2.mCSB_scrollTools .mCSB_draggerRail{
width: 4px;
background-color: #fff; background-color: rgba(255,255,255,0.1);
-webkit-border-radius: 1px; -moz-border-radius: 1px; border-radius: 1px;
}
.mCS-light-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-dark-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
width: 4px;
background-color: #fff; background-color: rgba(255,255,255,0.75);
-webkit-border-radius: 1px; -moz-border-radius: 1px; border-radius: 1px;
}
.mCS-light-2.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-dark-2.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-light-2.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-dark-2.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{
width: 100%;
height: 4px;
margin: 6px auto;
}
.mCS-light-2.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #fff; background-color: rgba(255,255,255,0.85); }
.mCS-light-2.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-light-2.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #fff; background-color: rgba(255,255,255,0.9); }
.mCS-light-2.mCSB_scrollTools .mCSB_buttonUp{ background-position: -32px 0; }
.mCS-light-2.mCSB_scrollTools .mCSB_buttonDown{ background-position: -32px -20px; }
.mCS-light-2.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -40px -40px; }
.mCS-light-2.mCSB_scrollTools .mCSB_buttonRight{ background-position: -40px -56px; }
/* theme: "dark-2" */
.mCS-dark-2.mCSB_scrollTools .mCSB_draggerRail{
background-color: #000; background-color: rgba(0,0,0,0.1);
-webkit-border-radius: 1px; -moz-border-radius: 1px; border-radius: 1px;
}
.mCS-dark-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
background-color: #000; background-color: rgba(0,0,0,0.75);
-webkit-border-radius: 1px; -moz-border-radius: 1px; border-radius: 1px;
}
.mCS-dark-2.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.85); }
.mCS-dark-2.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-dark-2.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.9); }
.mCS-dark-2.mCSB_scrollTools .mCSB_buttonUp{ background-position: -112px 0; }
.mCS-dark-2.mCSB_scrollTools .mCSB_buttonDown{ background-position: -112px -20px; }
.mCS-dark-2.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -120px -40px; }
.mCS-dark-2.mCSB_scrollTools .mCSB_buttonRight{ background-position: -120px -56px; }
/* ---------------------------------------- */
/* theme: "light-thick", "dark-thick" */
.mCS-light-thick.mCSB_scrollTools .mCSB_draggerRail,
.mCS-dark-thick.mCSB_scrollTools .mCSB_draggerRail{
width: 4px;
background-color: #fff; background-color: rgba(255,255,255,0.1);
-webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px;
}
.mCS-light-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
width: 6px;
background-color: #fff; background-color: rgba(255,255,255,0.75);
-webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px;
}
.mCS-light-thick.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-dark-thick.mCSB_scrollTools_horizontal .mCSB_draggerRail{
width: 100%;
height: 4px;
margin: 6px 0;
}
.mCS-light-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-dark-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{
width: 100%;
height: 6px;
margin: 5px auto;
}
.mCS-light-thick.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #fff; background-color: rgba(255,255,255,0.85); }
.mCS-light-thick.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-light-thick.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #fff; background-color: rgba(255,255,255,0.9); }
.mCS-light-thick.mCSB_scrollTools .mCSB_buttonUp{ background-position: -16px 0; }
.mCS-light-thick.mCSB_scrollTools .mCSB_buttonDown{ background-position: -16px -20px; }
.mCS-light-thick.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -20px -40px; }
.mCS-light-thick.mCSB_scrollTools .mCSB_buttonRight{ background-position: -20px -56px; }
/* theme: "dark-thick" */
.mCS-dark-thick.mCSB_scrollTools .mCSB_draggerRail{
background-color: #000; background-color: rgba(0,0,0,0.1);
-webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px;
}
.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
background-color: #000; background-color: rgba(0,0,0,0.75);
-webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px;
}
.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.85); }
.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.9); }
.mCS-dark-thick.mCSB_scrollTools .mCSB_buttonUp{ background-position: -96px 0; }
.mCS-dark-thick.mCSB_scrollTools .mCSB_buttonDown{ background-position: -96px -20px; }
.mCS-dark-thick.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -100px -40px; }
.mCS-dark-thick.mCSB_scrollTools .mCSB_buttonRight{ background-position: -100px -56px; }
/* ---------------------------------------- */
/* theme: "light-thin", "dark-thin" */
.mCS-light-thin.mCSB_scrollTools .mCSB_draggerRail{ background-color: #fff; background-color: rgba(255,255,255,0.1); }
.mCS-light-thin.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ width: 2px; }
.mCS-light-thin.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-dark-thin.mCSB_scrollTools_horizontal .mCSB_draggerRail{ width: 100%; }
.mCS-light-thin.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-dark-thin.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{
width: 100%;
height: 2px;
margin: 7px auto;
}
/* theme "dark-thin" */
.mCS-dark-thin.mCSB_scrollTools .mCSB_draggerRail{ background-color: #000; background-color: rgba(0,0,0,0.15); }
.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.75); }
.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.85); }
.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.9); }
.mCS-dark-thin.mCSB_scrollTools .mCSB_buttonUp{ background-position: -80px 0; }
.mCS-dark-thin.mCSB_scrollTools .mCSB_buttonDown{ background-position: -80px -20px; }
.mCS-dark-thin.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -80px -40px; }
.mCS-dark-thin.mCSB_scrollTools .mCSB_buttonRight{ background-position: -80px -56px; }
/* ---------------------------------------- */
/* theme "rounded", "rounded-dark", "rounded-dots", "rounded-dots-dark" */
.mCS-rounded.mCSB_scrollTools .mCSB_draggerRail{ background-color: #fff; background-color: rgba(255,255,255,0.15); }
.mCS-rounded.mCSB_scrollTools .mCSB_dragger,
.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger,
.mCS-rounded-dots.mCSB_scrollTools .mCSB_dragger,
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger{ height: 14px; }
.mCS-rounded.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded-dots.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
width: 14px;
margin: 0 1px;
}
.mCS-rounded.mCSB_scrollTools_horizontal .mCSB_dragger,
.mCS-rounded-dark.mCSB_scrollTools_horizontal .mCSB_dragger,
.mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_dragger,
.mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_dragger{ width: 14px; }
.mCS-rounded.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{
height: 14px;
margin: 1px 0;
}
.mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,
.mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,
.mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar{
width: 16px; /* auto-expanded scrollbar */
height: 16px;
margin: -1px 0;
}
.mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail,
.mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail,
.mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail,
.mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail{ width: 4px; /* auto-expanded scrollbar */ }
.mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,
.mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,
.mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar{
height: 16px; /* auto-expanded scrollbar */
width: 16px;
margin: 0 -1px;
}
.mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail,
.mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail,
.mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail,
.mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail{
height: 4px; /* auto-expanded scrollbar */
margin: 6px 0;
}
.mCS-rounded.mCSB_scrollTools .mCSB_buttonUp{ background-position: 0 -72px; }
.mCS-rounded.mCSB_scrollTools .mCSB_buttonDown{ background-position: 0 -92px; }
.mCS-rounded.mCSB_scrollTools .mCSB_buttonLeft{ background-position: 0 -112px; }
.mCS-rounded.mCSB_scrollTools .mCSB_buttonRight{ background-position: 0 -128px; }
/* theme "rounded-dark", "rounded-dots-dark" */
.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.75); }
.mCS-rounded-dark.mCSB_scrollTools .mCSB_draggerRail{ background-color: #000; background-color: rgba(0,0,0,0.15); }
.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.85); }
.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.9); }
.mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonUp{ background-position: -80px -72px; }
.mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonDown{ background-position: -80px -92px; }
.mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -80px -112px; }
.mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonRight{ background-position: -80px -128px; }
/* theme "rounded-dots", "rounded-dots-dark" */
.mCS-rounded-dots.mCSB_scrollTools_vertical .mCSB_draggerRail,
.mCS-rounded-dots-dark.mCSB_scrollTools_vertical .mCSB_draggerRail{ width: 4px; }
.mCS-rounded-dots.mCSB_scrollTools .mCSB_draggerRail,
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail{
background-color: transparent;
background-position: center;
}
.mCS-rounded-dots.mCSB_scrollTools .mCSB_draggerRail,
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_draggerRail{
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAANElEQVQYV2NkIAAYiVbw//9/Y6DiM1ANJoyMjGdBbLgJQAX/kU0DKgDLkaQAvxW4HEvQFwCRcxIJK1XznAAAAABJRU5ErkJggg==");
background-repeat: repeat-y;
opacity: 0.3;
filter: "alpha(opacity=30)"; -ms-filter: "alpha(opacity=30)";
}
.mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail{
height: 4px;
margin: 6px 0;
background-repeat: repeat-x;
}
.mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonUp{ background-position: -16px -72px; }
.mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonDown{ background-position: -16px -92px; }
.mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -20px -112px; }
.mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonRight{ background-position: -20px -128px; }
/* theme "rounded-dots-dark" */
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_draggerRail{
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAALElEQVQYV2NkIAAYSVFgDFR8BqrBBEifBbGRTfiPZhpYjiQFBK3A6l6CvgAAE9kGCd1mvgEAAAAASUVORK5CYII=");
}
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonUp{ background-position: -96px -72px; }
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonDown{ background-position: -96px -92px; }
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -100px -112px; }
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonRight{ background-position: -100px -128px; }
/* ---------------------------------------- */
/* theme "3d", "3d-dark", "3d-thick", "3d-thick-dark" */
.mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
background-repeat: repeat-y;
background-image: -moz-linear-gradient(left, rgba(255,255,255,0.5) 0%, rgba(255,255,255,0) 100%);
background-image: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(255,255,255,0.5)), color-stop(100%,rgba(255,255,255,0)));
background-image: -webkit-linear-gradient(left, rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 100%);
background-image: -o-linear-gradient(left, rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 100%);
background-image: -ms-linear-gradient(left, rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 100%);
background-image: linear-gradient(to right, rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 100%);
}
.mCS-3d.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{
background-repeat: repeat-x;
background-image: -moz-linear-gradient(top, rgba(255,255,255,0.5) 0%, rgba(255,255,255,0) 100%);
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,0.5)), color-stop(100%,rgba(255,255,255,0)));
background-image: -webkit-linear-gradient(top, rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 100%);
background-image: -o-linear-gradient(top, rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 100%);
background-image: -ms-linear-gradient(top, rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 100%);
background-image: linear-gradient(to bottom, rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 100%);
}
/* theme "3d", "3d-dark" */
.mCS-3d.mCSB_scrollTools_vertical .mCSB_dragger,
.mCS-3d-dark.mCSB_scrollTools_vertical .mCSB_dragger{ height: 70px; }
.mCS-3d.mCSB_scrollTools_horizontal .mCSB_dragger,
.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_dragger{ width: 70px; }
.mCS-3d.mCSB_scrollTools,
.mCS-3d-dark.mCSB_scrollTools{
opacity: 1;
filter: "alpha(opacity=30)"; -ms-filter: "alpha(opacity=30)";
}
.mCS-3d.mCSB_scrollTools .mCSB_draggerRail,
.mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ -webkit-border-radius: 16px; -moz-border-radius: 16px; border-radius: 16px; }
.mCS-3d.mCSB_scrollTools .mCSB_draggerRail,
.mCS-3d-dark.mCSB_scrollTools .mCSB_draggerRail{
width: 8px;
background-color: #000; background-color: rgba(0,0,0,0.2);
box-shadow: inset 1px 0 1px rgba(0,0,0,0.5), inset -1px 0 1px rgba(255,255,255,0.2);
}
.mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
.mCS-3d.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-3d.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #555; }
.mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ width: 8px; }
.mCS-3d.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail{
width: 100%;
height: 8px;
margin: 4px 0;
box-shadow: inset 0 1px 1px rgba(0,0,0,0.5), inset 0 -1px 1px rgba(255,255,255,0.2);
}
.mCS-3d.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{
width: 100%;
height: 8px;
margin: 4px auto;
}
.mCS-3d.mCSB_scrollTools .mCSB_buttonUp{ background-position: -32px -72px; }
.mCS-3d.mCSB_scrollTools .mCSB_buttonDown{ background-position: -32px -92px; }
.mCS-3d.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -40px -112px; }
.mCS-3d.mCSB_scrollTools .mCSB_buttonRight{ background-position: -40px -128px; }
/* theme "3d-dark" */
.mCS-3d-dark.mCSB_scrollTools .mCSB_draggerRail{
background-color: #000; background-color: rgba(0,0,0,0.1);
box-shadow: inset 1px 0 1px rgba(0,0,0,0.1);
}
.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail{ box-shadow: inset 0 1px 1px rgba(0,0,0,0.1); }
.mCS-3d-dark.mCSB_scrollTools .mCSB_buttonUp{ background-position: -112px -72px; }
.mCS-3d-dark.mCSB_scrollTools .mCSB_buttonDown{ background-position: -112px -92px; }
.mCS-3d-dark.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -120px -112px; }
.mCS-3d-dark.mCSB_scrollTools .mCSB_buttonRight{ background-position: -120px -128px; }
/* ---------------------------------------- */
/* theme: "3d-thick", "3d-thick-dark" */
.mCS-3d-thick.mCSB_scrollTools,
.mCS-3d-thick-dark.mCSB_scrollTools{
opacity: 1;
filter: "alpha(opacity=30)"; -ms-filter: "alpha(opacity=30)";
}
.mCS-3d-thick.mCSB_scrollTools,
.mCS-3d-thick-dark.mCSB_scrollTools,
.mCS-3d-thick.mCSB_scrollTools .mCSB_draggerContainer,
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_draggerContainer{ -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; }
.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; }
.mCSB_inside + .mCS-3d-thick.mCSB_scrollTools_vertical,
.mCSB_inside + .mCS-3d-thick-dark.mCSB_scrollTools_vertical{ right: 1px; }
.mCS-3d-thick.mCSB_scrollTools_vertical,
.mCS-3d-thick-dark.mCSB_scrollTools_vertical{ box-shadow: inset 1px 0 1px rgba(0,0,0,0.1), inset 0 0 14px rgba(0,0,0,0.5); }
.mCS-3d-thick.mCSB_scrollTools_horizontal,
.mCS-3d-thick-dark.mCSB_scrollTools_horizontal{
bottom: 1px;
box-shadow: inset 0 1px 1px rgba(0,0,0,0.1), inset 0 0 14px rgba(0,0,0,0.5);
}
.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
box-shadow: inset 1px 0 0 rgba(255,255,255,0.4);
width: 12px;
margin: 2px;
position: absolute;
height: auto;
top: 0;
bottom: 0;
left: 0;
right: 0;
}
.mCS-3d-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{ box-shadow: inset 0 1px 0 rgba(255,255,255,0.4); }
.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #555; }
.mCS-3d-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{
height: 12px;
width: auto;
}
.mCS-3d-thick.mCSB_scrollTools .mCSB_draggerContainer{
background-color: #000; background-color: rgba(0,0,0,0.05);
box-shadow: inset 1px 1px 16px rgba(0,0,0,0.1);
}
.mCS-3d-thick.mCSB_scrollTools .mCSB_draggerRail{ background-color: transparent; }
.mCS-3d-thick.mCSB_scrollTools .mCSB_buttonUp{ background-position: -32px -72px; }
.mCS-3d-thick.mCSB_scrollTools .mCSB_buttonDown{ background-position: -32px -92px; }
.mCS-3d-thick.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -40px -112px; }
.mCS-3d-thick.mCSB_scrollTools .mCSB_buttonRight{ background-position: -40px -128px; }
/* theme: "3d-thick-dark" */
.mCS-3d-thick-dark.mCSB_scrollTools{ box-shadow: inset 0 0 14px rgba(0,0,0,0.2); }
.mCS-3d-thick-dark.mCSB_scrollTools_horizontal{ box-shadow: inset 0 1px 1px rgba(0,0,0,0.1), inset 0 0 14px rgba(0,0,0,0.2); }
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ box-shadow: inset 1px 0 0 rgba(255,255,255,0.4), inset -1px 0 0 rgba(0,0,0,0.2); }
.mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{ box-shadow: inset 0 1px 0 rgba(255,255,255,0.4), inset 0 -1px 0 rgba(0,0,0,0.2); }
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #777; }
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_draggerContainer{
background-color: #fff; background-color: rgba(0,0,0,0.05);
box-shadow: inset 1px 1px 16px rgba(0,0,0,0.1);
}
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_draggerRail{ background-color: transparent; }
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonUp{ background-position: -112px -72px; }
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonDown{ background-position: -112px -92px; }
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -120px -112px; }
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonRight{ background-position: -120px -128px; }
/* ---------------------------------------- */
/* theme: "minimal", "minimal-dark" */
.mCSB_outside + .mCS-minimal.mCSB_scrollTools_vertical,
.mCSB_outside + .mCS-minimal-dark.mCSB_scrollTools_vertical{
right: 0;
margin: 12px 0;
}
.mCustomScrollBox.mCS-minimal + .mCSB_scrollTools.mCSB_scrollTools_horizontal,
.mCustomScrollBox.mCS-minimal + .mCSB_scrollTools + .mCSB_scrollTools.mCSB_scrollTools_horizontal,
.mCustomScrollBox.mCS-minimal-dark + .mCSB_scrollTools.mCSB_scrollTools_horizontal,
.mCustomScrollBox.mCS-minimal-dark + .mCSB_scrollTools + .mCSB_scrollTools.mCSB_scrollTools_horizontal{
bottom: 0;
margin: 0 12px;
}
/* RTL direction/left-side scrollbar */
.mCS-dir-rtl > .mCSB_outside + .mCS-minimal.mCSB_scrollTools_vertical,
.mCS-dir-rtl > .mCSB_outside + .mCS-minimal-dark.mCSB_scrollTools_vertical{
left: 0;
right: auto;
}
.mCS-minimal.mCSB_scrollTools .mCSB_draggerRail,
.mCS-minimal-dark.mCSB_scrollTools .mCSB_draggerRail{ background-color: transparent; }
.mCS-minimal.mCSB_scrollTools_vertical .mCSB_dragger,
.mCS-minimal-dark.mCSB_scrollTools_vertical .mCSB_dragger{ height: 50px; }
.mCS-minimal.mCSB_scrollTools_horizontal .mCSB_dragger,
.mCS-minimal-dark.mCSB_scrollTools_horizontal .mCSB_dragger{ width: 50px; }
.mCS-minimal.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
background-color: #fff; background-color: rgba(255,255,255,0.2);
filter: "alpha(opacity=20)"; -ms-filter: "alpha(opacity=20)";
}
.mCS-minimal.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-minimal.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{
background-color: #fff; background-color: rgba(255,255,255,0.5);
filter: "alpha(opacity=50)"; -ms-filter: "alpha(opacity=50)";
}
/* theme: "minimal-dark" */
.mCS-minimal-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
background-color: #000; background-color: rgba(0,0,0,0.2);
filter: "alpha(opacity=20)"; -ms-filter: "alpha(opacity=20)";
}
.mCS-minimal-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-minimal-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{
background-color: #000; background-color: rgba(0,0,0,0.5);
filter: "alpha(opacity=50)"; -ms-filter: "alpha(opacity=50)";
}
/* ---------------------------------------- */
/* theme "light-3", "dark-3" */
.mCS-light-3.mCSB_scrollTools .mCSB_draggerRail,
.mCS-dark-3.mCSB_scrollTools .mCSB_draggerRail{
width: 6px;
background-color: #000; background-color: rgba(0,0,0,0.2);
}
.mCS-light-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-dark-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ width: 6px; }
.mCS-light-3.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-dark-3.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-light-3.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-dark-3.mCSB_scrollTools_horizontal .mCSB_draggerRail{
width: 100%;
height: 6px;
margin: 5px 0;
}
.mCS-light-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail,
.mCS-light-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail,
.mCS-dark-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail,
.mCS-dark-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail{
width: 12px;
}
.mCS-light-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail,
.mCS-light-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail,
.mCS-dark-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail,
.mCS-dark-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail{
height: 12px;
margin: 2px 0;
}
.mCS-light-3.mCSB_scrollTools .mCSB_buttonUp{ background-position: -32px -72px; }
.mCS-light-3.mCSB_scrollTools .mCSB_buttonDown{ background-position: -32px -92px; }
.mCS-light-3.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -40px -112px; }
.mCS-light-3.mCSB_scrollTools .mCSB_buttonRight{ background-position: -40px -128px; }
/* theme "dark-3" */
.mCS-dark-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.75); }
.mCS-dark-3.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.85); }
.mCS-dark-3.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-dark-3.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.9); }
.mCS-dark-3.mCSB_scrollTools .mCSB_draggerRail{ background-color: #000; background-color: rgba(0,0,0,0.1); }
.mCS-dark-3.mCSB_scrollTools .mCSB_buttonUp{ background-position: -112px -72px; }
.mCS-dark-3.mCSB_scrollTools .mCSB_buttonDown{ background-position: -112px -92px; }
.mCS-dark-3.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -120px -112px; }
.mCS-dark-3.mCSB_scrollTools .mCSB_buttonRight{ background-position: -120px -128px; }
/* ---------------------------------------- */
/* theme "inset", "inset-dark", "inset-2", "inset-2-dark", "inset-3", "inset-3-dark" */
.mCS-inset.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset-2.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset-3.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_draggerRail{
width: 12px;
background-color: #000; background-color: rgba(0,0,0,0.2);
}
.mCS-inset.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
width: 6px;
margin: 3px 5px;
position: absolute;
height: auto;
top: 0;
bottom: 0;
left: 0;
right: 0;
}
.mCS-inset.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-2.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-2-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-3.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-3-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{
height: 6px;
margin: 5px 3px;
position: absolute;
width: auto;
top: 0;
bottom: 0;
left: 0;
right: 0;
}
.mCS-inset.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-inset-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-inset-2.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-inset-2-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-inset-3.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-inset-3-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail{
width: 100%;
height: 12px;
margin: 2px 0;
}
.mCS-inset.mCSB_scrollTools .mCSB_buttonUp,
.mCS-inset-2.mCSB_scrollTools .mCSB_buttonUp,
.mCS-inset-3.mCSB_scrollTools .mCSB_buttonUp{ background-position: -32px -72px; }
.mCS-inset.mCSB_scrollTools .mCSB_buttonDown,
.mCS-inset-2.mCSB_scrollTools .mCSB_buttonDown,
.mCS-inset-3.mCSB_scrollTools .mCSB_buttonDown{ background-position: -32px -92px; }
.mCS-inset.mCSB_scrollTools .mCSB_buttonLeft,
.mCS-inset-2.mCSB_scrollTools .mCSB_buttonLeft,
.mCS-inset-3.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -40px -112px; }
.mCS-inset.mCSB_scrollTools .mCSB_buttonRight,
.mCS-inset-2.mCSB_scrollTools .mCSB_buttonRight,
.mCS-inset-3.mCSB_scrollTools .mCSB_buttonRight{ background-position: -40px -128px; }
/* theme "inset-dark", "inset-2-dark", "inset-3-dark" */
.mCS-inset-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.75); }
.mCS-inset-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.85); }
.mCS-inset-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-inset-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.9); }
.mCS-inset-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_draggerRail{ background-color: #000; background-color: rgba(0,0,0,0.1); }
.mCS-inset-dark.mCSB_scrollTools .mCSB_buttonUp,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonUp,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonUp{ background-position: -112px -72px; }
.mCS-inset-dark.mCSB_scrollTools .mCSB_buttonDown,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonDown,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonDown{ background-position: -112px -92px; }
.mCS-inset-dark.mCSB_scrollTools .mCSB_buttonLeft,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonLeft,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -120px -112px; }
.mCS-inset-dark.mCSB_scrollTools .mCSB_buttonRight,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonRight,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonRight{ background-position: -120px -128px; }
/* theme "inset-2", "inset-2-dark" */
.mCS-inset-2.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail{
background-color: transparent;
border-width: 1px;
border-style: solid;
border-color: #fff;
border-color: rgba(255,255,255,0.2);
-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;
}
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail{ border-color: #000; border-color: rgba(0,0,0,0.2); }
/* theme "inset-3", "inset-3-dark" */
.mCS-inset-3.mCSB_scrollTools .mCSB_draggerRail{ background-color: #fff; background-color: rgba(255,255,255,0.6); }
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_draggerRail{ background-color: #000; background-color: rgba(0,0,0,0.6); }
.mCS-inset-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.75); }
.mCS-inset-3.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.85); }
.mCS-inset-3.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-inset-3.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.9); }
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background-color: #fff; background-color: rgba(255,255,255,0.75); }
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #fff; background-color: rgba(255,255,255,0.85); }
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #fff; background-color: rgba(255,255,255,0.9); }
/* ---------------------------------------- */
.content{
overflow: auto;
-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;
}
.content.hidden{ display: none; }
.content.light{
background-color: #ddd;
color: #333;
}
.content hr{
margin-bottom: -10px;
border-top: 1px solid rgba(0,0,0,0.7);
}
.content.light hr{
border-bottom: 1px solid rgba(255,255,255,0.6);
border-top: 1px solid rgba(0,0,0,0.1);
}
.softwarepara{
font-size:1.2em!important;
}