body { color: #585858; font-family: 'Nunito', sans-serif; font-weight: 300; letter-spacing: 1px; padding: 0 !important; overflow:auto !important; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px } .btn-same { min-width: 200px; } .navbar { margin-bottom: 0; } .navbar-default,.mega-menu-wrap { background: #FFFFFF; border: none; font-size: 12px !important; text-transform: uppercase !important; } header { position: relative; } #menu-top-menu,#mega-menu-wrap-main_nav li { padding:0 8px; } .social_top { border-left: 1px solid #dddddd; float: right; /* margin-left:18px;*/ margin-top: 18px; padding-left: 15px; } .social_top ul { display: block; list-style: outside none none; margin: 0; padding: 0; } .social_top ul li { display: inline-block; font-size: 1.4em; margin: 0; } .social_top ul li a { border-radius: 50%; color: #ffffff; display: block; font-size: 12px; height: 25px; line-height: 1px; margin: 0; padding:7px 0 0; text-align: center; width: 25px; } .social_top ul li:nth-child(1) a { background:#3b5998; } .social_top ul li:nth-child(1) a:hover{ background:#1e52c0; } .social_top ul li:nth-child(2) a{ background:#55acee; } .social_top ul li:nth-child(2) a:hover{ background:#3086c7; } .social_top ul li:nth-child(3) a{ background:#cc191e; } .social_top ul li:nth-child(3) a:hover{ background:#dd151a; } #menu-top-menu,#mega-menu-wrap-main_nav { float: left !important; margin-left: 2%; } .navbar-default .navbar-nav,.mega-menu-wrap a, .navbar-default .navbar-nav,.mega-menu-wrap a:hover, .navbar-default .navbar-nav,.mega-menu-wrap a:focus, .navbar-default .navbar-nav,.mega-menu-wrap li a, .navbar-default .navbar-nav,.mega-menu-wrap li a:hover, .navbar-default .navbar-nav,.mega-menu-wrap li a:focus { background: transparent; /* border-bottom: 2px solid #585858; */ color: #585858; padding: 20px 0px; } .navbar-default .navbar-nav,.mega-menu-wrap li { padding: 0 15px; } .navbar-default .navbar-toggle .icon-bar { background: #fff; } .video-container-1 { position:relative; padding-bottom:48%; padding-top:30px; height:0; overflow:hidden; } .video-container-1 iframe, .video-container object, .video-container embed { position:absolute; top:0; left:0; width:100%; height:100%; } .navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus { background: #2d3090; } .navbar-toggle { background-color: #2d3090; } .navbar-default .navbar-toggle { border-color: #2d3090; } .navbar-default .navbar-toggle .icon-bar:nth-of-type(2) { top: 1px; } .navbar-default .navbar-toggle .icon-bar:nth-of-type(3) { top: 2px; } .navbar-default .navbar-toggle .icon-bar { position: relative; transition: all 500ms ease-in-out; } .navbar-default .navbar-toggle.active .icon-bar:nth-of-type(1) { top: 6px; -webkit-transform: rotate(45deg); transform: rotate(45deg); } .navbar-default .navbar-toggle.active .icon-bar:nth-of-type(2) { background-color: transparent; } .navbar-default .navbar-toggle.active .icon-bar:nth-of-type(3) { top: -6px; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); } .text-left-inline { padding-left: 0px; } .text-left-inline-1 { padding-left: 0px; } /* .logo { height: 36px; } */ .logo { height: 66px; margin-top: -14px; } .hero { background: url(images/hero.jpg) no-repeat center center; -webkit-background-size: cover; -moz-background-size: cover; background-size: cover; background-repeat: no-repeat; background-position: center bottom; color: #fff; padding: 95px 0 125px; text-align: center; margin-top: -50px; min-height: /* 330px */ 264px; position: relative; -webkit-box-shadow: inset 0px 0px 185px rgba(0,0,0,0.4); -moz-box-shadow: inset 0px 0px 185px rgba(0,0,0,0.4); box-shadow: inset 0px 0px 185px rgba(0,0,0,0.4); } .home .hero { padding: 95px 0 65px; } .hero h1 { font-size: 36px; font-weight: 300; letter-spacing: 1px; line-height: 1.5em; margin-bottom: 20px; text-transform: uppercase; } .hero h1 small { color: #fff; display: block; font-size: 14px; text-transform: none; } .page .hero h2 { margin-top: 0; } .page-title { color: #2f0097; font-size: 24px; text-transform: uppercase; } .page-title-1 { color: #2f0097; font-size: 24px; text-transform: uppercase; text-align: center; } #main { margin-top: 10px; } .sidebar { margin-top: 28px; } .sidebar-left { margin-bottom: 50px; } #tutors-london-sidebar { padding: 10px; } #tag-cloud a { word-break: break-word; } #tag-cloud a:hover { color: #f36f2c; text-decoration: underline; } .widget ul { list-style: none; } .widget ul li { padding-bottom: 20px; } .widget ul li a { font-size: 14px; line-height: 21px; } .widgettitle { color: #767676; margin-bottom: 25px; text-transform: uppercase; } #breadcrumbs { margin: 0; } .breadcrumb_last { font-weight: 300; } .breadcrumbs { margin-top: 30px; margin-bottom: 10px; } section { padding: 60px 0; } .inter_content .btn-primary{max-width:200px; display:inline-block;} section.grey { background: #f7f7f7; background: #f7f7f7; height: auto; /* overflow: hidden; */ clear: both; } .container-main { padding: 15px; } section.grey.tutor_london { padding: 0; } section.grey ul { color: #f36f2c; font-weight: 500; list-style-image: url('images/icons/tick.svg'); } section.contact-info { background: #2d3090; color: #fff; font-size: 13px; padding: 18px 0; -webkit-box-shadow: 0 5px 6px 0px #999; -moz-box-shadow: 0 5px 6px 0px #999; box-shadow: 0 5px 6px 0px #999; } section.contact-info a { color: #fff; } .contact-info-mail, .contact-info-phone { display: inline-block; margin-right: 20px; cursor: pointer; padding-top:5px; } section h2, section h3 { text-transform: uppercase; } section h3 { line-height: 36px; } section em { font-weight: 500; font-size: 18px; } section.case-study h4 { text-transform: none; } a { color: #f36f2c; font-weight: 500; } a:hover, a:focus { color: #f36f2c; } p.lead { font-size: 18px; line-height: 27px; } .light { font-weight: 300; color: #767676; } h3.light { font-size: 18px; text-transform: uppercase; margin-bottom: 0; margin-top: 30px; } .word-break { word-break: break-all; } .orange { color: #f36f2c; } .blue { color: #2f0097; } .btn { -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; letter-spacing: 2px; text-transform: uppercase; } .btn-lg { font-size: 14px; } .opening-hours-1 { text-align: center; padding: 0cm; } .opening-hours-2 { text-align: center; /*padding-top: 120px;*/ } .title-center { text-align: center; } .title-center-1 { text-align: center; } .video-center { text-align:center; } .form-center{ align:"center"; text-align: center; } .breadcrumbs-123 { text-align: left; padding: 0cm; } .row-1 { text-align: center; } .btn-warning { background: #f36f2c; border: 3px solid #f36f2c; border-color: #f36f2c; } .btn-warning:hover, .btn-warning:focus { background: #e26424; border-color: #e26424; } .btn-primary { background: transparent; border: 3px solid #f36f2c; color: #f36f2c; } .btn-primary:hover, .btn-primary:focus { background: #f36f2c; border-color: #f36f2c; } .btn-margin { margin: 5px; } .text-center .img-responsive { margin: 0 auto; } .img-map, .img-tutor { width: 100%; } .google-map { margin-bottom: -5px; } .map-overlay, .contact-map-overlay { background: transparent; position: relative; width :100%; height: 260px; top: 260px; margin-top: -260px; z-index: 1; } .contact-map-overlay { height: 400px; top: 400px; margin-top: -400px; } .contact-map-overlay-1 { background: transparent; position: relative; text-align: center; width :100%; z-index: 1; } .arrow { text-align: center; } .contact-google-map { margin-top:-60px; margin-bottom: -75px; filter: url("data:image/svg+xml;utf8,#grayscale"); /* Firefox 10+ */ filter: gray; /* IE6-9 */ -webkit-filter: grayscale(99%); /* Chrome 19+ & Safari 6+ */ -webkit-backface-visibility: hidden; /* Fix for transition flickering */ } .contact-google-map-contact { margin-bottom: -5px; filter: url("data:image/svg+xml;utf8,#grayscale"); /* Firefox 10+ */ filter: gray; /* IE6-9 */ -webkit-filter: grayscale(99%); /* Chrome 19+ & Safari 6+ */ -webkit-backface-visibility: hidden; /* Fix for transition flickering */ } .well { border: none; } .well-white { background: #fff; } .well-white h3 { margin-top: 0; } .well-white h3 small { display: block; font-size: 12px; font-weight: 300; } .well-white em { font-weight: 300; } .well-white p img { vertical-align: text-top; } .well-line::after { background-image: url(images/line.png); content: " "; width: 48px; height: 10px; position: absolute; right: -24px; top: 20px; z-index: 1; } .well-transparent { background: #fff; background: rgba(255, 255, 255, .9); color: #585858; padding: 25px; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; } hr.space { border: none; margin: 60px 0; } .no-margin { margin: 0 !important; } .width100 { width: 100% !important; } .twitter-typeahead { width: 100% !important; } .tt-open { } .tt-menu { background-color: #fff; border: 1px solid #ddd; width: 100%; } .tt-suggestion { padding: 10px 16px; } .tt-suggestion:hover { background: #eee; cursor: pointer; } .url { word-break: break-all; } .uppercase { text-transform: uppercase; } .moretag { margin-top: 100px; text-align: right; } .moretag-normal .moretag { margin-top: 30px; } .gs-web-image-box-landscape img.gs-image, .gs-web-image-box-portrait img.gs-image { margin-left: 5px; } .embed-responsive.embed-responsive-16by9 { margin-bottom: 20px; } blockquote { border: none; font-style: italic; } .custom-file-input { color: transparent; height: 50px; } .custom-file-input::-webkit-file-upload-button { visibility: hidden; } .custom-file-input::before { content: 'CHOOSE FILE'; color: #f36f2c; display: inline-block; background: #fff; border: 3px solid #f36f2c; border-radius: 3px; padding: 10px 39px; outline: none; white-space: nowrap; -webkit-user-select: none; cursor: pointer; font-weight: bold; font-size: 16px; letter-spacing: 2px; } .custom-file-input:hover::before { border-color: #f36f2c; outline: none; } .custom-file-input:active { outline: 0; } .custom-file-input:active::before { background: #f36f2c; color: #fff; } input[type="file"].custom-file-input:focus { outline: none; } .ajax-loader { display: none; } .modal-header, .modal-footer { border: none; } .search-form { display: inline-block; margin-left: 10px; overflow: hidden; position: relative; vertical-align: middle; } .search-form form { -webkit-transition-property: width; -moz-transition-property: width; -o-transition-property: width; transition-property: width; -webkit-transition-duration: 300ms; -moz-transition-duration: 300ms; -o-transition-duration: 300ms; transition-duration: 300ms; -webkit-transition-timing-function: ease-in-out; -moz-transition-timing-function: ease-in-out; -o-transition-timing-function: ease-in-out; transition-timing-function: ease-in-out; -webkit-border-radius: 15px; -moz-border-radius: 15px; -ms-border-radius: 15px; -o-border-radius: 15px; border-radius: 15px; overflow: visible; background: #fff; overflow: hidden; margin: 0; padding: 4px 15px; height: 30px; width: 30px; position: relative; } .search-form .form-control { height: 44px; width: 100%; } .search-form .btn { font-size: 18px; } .search-form .btn, .search-form .form-control { -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; } .search-form .search-input { -webkit-transition-property: opacity; -moz-transition-property: opacity; -o-transition-property: opacity; transition-property: opacity; -webkit-transition-duration: 400ms; -moz-transition-duration: 400ms; -o-transition-duration: 400ms; transition-duration: 400ms; -webkit-transition-timing-function: ease-in-out; -moz-transition-timing-function: ease-in-out; -o-transition-timing-function: ease-in-out; transition-timing-function: ease-in-out; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; top: 0; right: 25px; height: 30px; width: 170px; display: none; border: none; -webkit-box-shadow: none; box-shadow: none; position: absolute; } .search-form form.in-focus { width: 210px; } .search-form form:hover .search-input, .search-form form.in-focus .search-input { filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100); opacity: 1; display: block; } .search-form .search-trigger { position: absolute; top: 7px; left: 7px; width: 16px; height: 15px; border: 0; display: block; overflow: hidden; text-indent: -999px; background-repeat: no-repeat; background-position: 0 0; background-color: transparent; background-size: 16px 16px; background-image: url(images/icons/search.png); } .input-lg, .form-group-lg .form-control { -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; font-size: 14px; height: 44px; } label { margin-top: 10px; } .form-group-cv label { margin-top: 20px; } .form-group-cv small { font-size: 70%; } .recruitment-form label { text-align: right; } .blog-post-title { margin-top: 5px; text-transform: uppercase; margin-bottom: 5px; } .blog-post-title a { color: #585858; } .featured-blog-post { background: url(images/image.jpg) no-repeat center center; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; background-repeat: no-repeat; background-position: center bottom; color: #fff; padding: 25px; margin-top: 25px; margin-bottom: 50px; } .post-type-archive-blog .hero, .single-blog .hero { background: url(images/image2.jpg) no-repeat center center !important; -webkit-background-size: cover !important; -moz-background-size: cover !important; -o-background-size: cover !important; background-size: cover !important; } .single-post .hero { min-height: 240px; background: url(images/london2.jpg) no-repeat center center !important; -webkit-background-size: cover !important; -moz-background-size: cover !important; -o-background-size: cover !important; background-size: cover !important; } .page-template-page-tutors .hero, .category .hero { background: url(images/london2.jpg) no-repeat center center !important; -webkit-background-size: cover !important; -moz-background-size: cover !important; -o-background-size: cover !important; background-size: cover !important; } .post-type-archive-school_post .hero, .page-template-page-schools .hero { background: url(images/schools.jpg) no-repeat center center !important; -webkit-background-size: cover !important; -moz-background-size: cover !important; -o-background-size: cover !important; background-size: cover !important; } .single-school_post .hero { min-height: 240px; background: url(images/book.jpg) no-repeat center center !important; -webkit-background-size: cover !important; -moz-background-size: cover !important; -o-background-size: cover !important; } .page-template-page-consutling .hero { background: url(images/consulting.jpg) no-repeat center center !important; -webkit-background-size: cover !important; -moz-background-size: cover !important; -o-background-size: cover !important; } .page-template-page-travelling-tutors .hero { min-height: 240px; background: url(images/travelling.jpg) no-repeat center center !important; -webkit-background-size: cover !important; -moz-background-size: cover !important; -o-background-size: cover !important; } .search-results .hero { min-height: 240px; } .category_description p, .single-blog p, .single-post p, .single-school_post p { margin-bottom: 15px; } .single-post h4, .single-school_post h4, .page-template-page-residential-tutor h4 { margin-top: 0; margin-bottom: 20px; text-transform: uppercase; } .single-school_page .btn-book { display: none; } p.meta, #main p.meta { font-size: 10px; font-style: normal; text-transform: uppercase; } .pagination>.active>a, .pagination>.active>span, .pagination>.active>a:hover, .pagination>.active>span:hover, .pagination>.active>a:focus, .pagination>.active>span:focus { background-color: #f36f2c; border-color: #f36f2c; } .pagination>li>a, .pagination>li>span, .pagination>li>a:hover, .pagination>li>span:hover, .pagination>li>a:focus, .pagination>li>span:focus { color: #f36f2c; } li.next a:hover:before, li.previous a:hover:before { content: ''; background: transparent; box-shadow: none; } .ssba { margin-top: 5px; margin-bottom: 5px; } .subjects li a { color: #585858; font-size: 10px; padding: 2px 15px; } .profile-header { height: 120px; } .profile-header-background { -webkit-filter: blur(2px); -moz-filter: blur(2px); -o-filter: blur(2px); -ms-filter: blur(2px); filter: blur(2px); -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; height: 120px; background-color: #f7f7f7; } .page-template-page-schools .profile-header-background, .post-type-archive-school_post .profile-header-background { -webkit-filter: blur(0); -moz-filter: blur(0); -o-filter: blur(0); -ms-filter: blur(0); filter: blur(0); } .blur { -webkit-filter: blur(3px); -moz-filter: blur(3px); -o-filter: blur(3px); -ms-filter: blur(3px); filter: blur(3px); } .avatar { position: relative; top: -102px; text-align: center; } .avatar img { width: 85px; height: 85px; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; border: 4px solid #fff; -webkit-transition: box-shadow 0.2s; -moz-transition: box-shadow 0.2s; transition: box-shadow 0.2s; } .avatar img:hover { border: 4px solid transparent; -webkit-box-shadow: 0 0 0 8px rgba(255, 255, 255, .3); -moz-box-shadow: 0 0 0 8px rgba(255, 255, 255, .3); box-shadow: 0 0 0 8px rgba(255, 255, 255, .3); -webkit-transform: scale(.9); -moz-transform: scale(.9); -ms-transform: scale(.9); transform: scale(.9); } .thumbnail .avatar>img, .thumbnail .avatar a>img { margin: 0; } .thumbnail .avatar>img, .thumbnail .avatar a>img { display: inline; height: 85px; max-width: 85px; } .caption p { font-size: 12px; } .caption h4 { color: #585858; margin-top: 0; } .caption h4 a { color: #585858; } .caption .btn { border-width: 2px; font-size: 14px; font-weight: 600; text-transform: none; } .truncate { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .thumbnail { padding: 0; } .thumbnail img { width: 100%; } .category_description + [data-readmore-toggle] { background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, rgba(255,255,255,0)),color-stop(1, rgba(255,255,255,100))); height: 40px; margin-top: -70px; padding-top: 60px; position: absolute; text-align: right; right: 0; } .category_description[data-readmore] { margin-bottom: 25px; } .case_study_content + [data-readmore-toggle] { display: inline !important; } .case_study_content blockquote { font-size: 16px; padding: 0; } .square-element { float: left; width: 100%; height: 300px; margin-bottom: 30px; background: #fff; -webkit-background-size: cover !important; -moz-background-size: cover !important; background-size: cover !important; background-repeat: no-repeat; background-position: center bottom; } .square-element h2 { color: #fff; font-size: 30px; line-height: 36px; margin-top: 50%; text-align: center; text-transform: none; } .square-element.multiline h2 { margin-top: 40%; padding: 0 20px; } .square-element h3 { color: #fff; font-size: 24px; line-height: 36px; text-transform: none; } .square-element p { color: #fff; font-size: 12px; } .square-element .hover-text { background: #000; background: rgba(0, 0, 0, .6); display: none; height: 100%; padding: 20px; } .school-filter { background-color: #fff; border: 1px solid #ddd; border-radius: 4px; padding: 9px; } .school-filter h5 a, .school-filter .list-unstyled label , .sidebar-header a { color: #585858; } .school-filter h5 a, .school-filter h5 a:hover, .school-filter h5 a:focus, .sidebar-header a:hover, .sidebar-header a:focus { text-decoration: none; } .school-filter .option-group { border-top: 2px solid #f1f2f4; } .school-filter .option-group:first-child { border-top: none; } .school-filter .option-group:first-child h5 { margin-top: 5px; } .school-filter .option-group:last-child h5 { margin-bottom: 5px; } .school-filter i { width: 15px; } .school-filter .radio, .school-filter .checkbox { margin: 0; } .school-filter .input-isotope { margin-bottom: 5px; } .the-school-categories p { font-weight: bold; margin-bottom: 3px; } .single-school_post .the-school-categories p { margin-bottom: 0; padding: 0; font-size: 10px; } .footer { background: #2d3090; color: #d5d7ea; padding: 30px 0; text-align: center; } .footer-links { float: none; margin: 20px 0; } .footer-links a { color: #fff; font-size: 10px; font-weight: 700; text-transform: uppercase; } .footer-links .list-inline>li { padding: 0 10px; } h2 { font-weight: bold; font-size: 18px; } h3 { font-weight: bold; font-size: 14px; } .seen_in span{width:100%; display:block; font-size:18px; color:#F16F37; text-align:center; text-transform:uppercase; padding-bottom:20px;} .seen_in span img{padding:20px;} .press_headline_content h2{text-align:left;} #accordion { display: block; margin-top: -40px;} #accordion .panel-default > .panel-heading { background:none; border:0; position:relative; } #accordion .panel-default { border:0; } #accordion .panel-body { border:0; background:#f5f5f5; position:relative; } #accordion .panel { box-shadow:none; margin: 40px 0; } #accordion .panel-title { color: rgb(45, 48, 144); font-size:20px;} #accordion a { text-decoration:none !important } #accordion a:hover { text-decoration:none !important } #accordion a:focus { outline:0 !important; } #accordion a:active { text-decoration:none !important } .close_pnel_bdy { color: rgb(204, 204, 204); font-size: 25px; font-weight: 100; position: absolute; right: 20px; top: 10px; cursor:pointer} #accordion .panel-body p { display: block; margin: 0; padding: 25px;} #accordion .panel-default > .panel-heading i { color: rgb(2, 123, 255); font-weight: normal; position: absolute; right: 0; top: 11px;} /*----------------------------------- Press Page CSS ----------------------------------------------------------*/ .p0 { padding:0 !important; } .press_headline_content {position: relative; float: left; margin-top: 40px; width: 100%;} .press_headline_content::after { background:#f36f2c; content: ""; height: 97.8%; left: 8.33333%; position: absolute; top: 58px; width: 2px;} .new_head_line h2{ border-bottom: 1px solid rgb(221, 221, 221); display: block; font-size: 25px; font-weight: 300; margin: 0; padding: 0 0 10px;} .news_with_date { display: block; margin-top: 30px; overflow: hidden;} .news_with_date .date { color:#2d3090; display: block; font-size: 25px; font-weight: 300; position: relative;} .news_with_date .news_blocks { display: block; overflow: hidden; padding-left: 30px;} .news_with_date .news_blocks .news_box { background: rgb(245, 245, 245); display: block; margin: 5px; min-height: 200px; padding: 15px;} .news_with_date .news_blocks .news_box h3 { color:#f36f2c; display: block; font-size: 16px; margin: 0 0 13px; padding: 0; line-height:20px; text-transform: inherit;} .news_with_date .news_blocks .news_box h3 a { color:#f57036; text-transform:capitalize;} .news_with_date .news_blocks .news_box p {color: #585858; display: block; margin: 0; padding: 0;} .news_with_date .news_blocks .news_box p.date_text { color:#c4c4c4; padding-top: 10px;} .news_with_date .date::after { background:#2d3090; border: 2px solid #fff; border-radius: 50%; bottom: 0; content: ""; height: 16px; margin: auto; position: absolute; right: -8px; top: 0; width: 16px; z-index: 2;} .press_pack_section { background: rgb(245, 245, 245); display: block;} .press_pack_section h3 {color: rgb(45, 48, 144); display: block; font-weight: 300; text-align: center; margin:0; padding:0;} .press_pack_section h4 { display:block; text-align:center; font-weight:300; margin:0; padding:0; font-size: 16px; background:none !important; color:#666 !important } .years { display: block; margin: 30px auto; width: 90%;} .years .year_head { color: #f36f2c; display: block; font-size: 18px;} .years ul { display: block; list-style:none; margin: 10px -4px; padding: 0;} .years ul li { display: inline-block; margin: 4px;} .years ul li span { display:block;} .years img { /* max-width:100%; */ width:100%; /* height:150px; */ } .years a{display: table-cell; height: 150px; vertical-align: middle;} .images_videos_block { margin-top: 40px;} .images_videos_block h5{ border-bottom: 1px solid rgb(221, 221, 221); display: block; font-size: 20px; text-transform:uppercase; font-weight: 300; margin: 0; padding: 0 0 10px;} .brand_photo { display: block; margin: 50px auto; overflow: hidden; width: 50%;} .brand_photo_box { display: block; text-align: center;} .brand_photo_box > p { display: block; margin: 0; padding: 5px 0;} .brand_photo_box > p.b_head {color: rgb(45, 48, 144); display: block; font-size: 18px; padding-top: 10px !important; text-transform: uppercase;} .btn_download { background: rgb(243, 111, 44); color: rgb(255, 255, 255); display: inline-block; margin: 10px 0 0; padding: 10px 25px; transition:all 0.3s; border:1px solid rgb(243, 111, 44);} .btn_download:hover {background:none; color:rgb(243, 111, 44); } #tutors-london-sidebar { box-shadow: none; display: block; float: left; margin-bottom: 20px; padding: 0; position: relative; width: 100%;} #tutors-london-sidebar h5 { border-right: 1px solid rgb(221, 221, 221); float:left; font-size: 15px; font-weight: 300; margin: 0; min-width: 20%; padding:30px 10px 30px 90px; cursor:pointer; font-size:16px; font-weight:400; text-transform: uppercase; color:#585858; } #tutors-london-sidebar h5 img { float: left; margin-right: 10px;} #tutors-london-sidebar h5 span { display:block; } .isotop-controls { background: rgb(255, 255, 255); border:5px solid #f57036; position: absolute; top:94px; width: 100%; z-index:10; display:none; max-height:490px; padding:40px;} #tutors-london-sidebar h5.active { background: rgb(245, 112, 54) none repeat scroll 0 0; color: rgb(255, 255, 255);} #tutors-london-sidebar h5:nth-of-type(1) {background: url("images/icons/book1234.svg") no-repeat scroll 30px center #fff; } #tutors-london-sidebar h5.active:nth-of-type(1) {background: url("images/icons/book123hover.svg") no-repeat scroll 30px center #F57036; border-right: 0 none;} #tutors-london-sidebar h5:nth-of-type(2) {background: url("images/icons/speach12.svg") no-repeat scroll 30px center #fff; } #tutors-london-sidebar h5.active:nth-of-type(2) {background: url("images/icons/speach123.svg") no-repeat scroll 30px center #F57036; border-right: 0 none;} #tutors-london-sidebar h5:nth-of-type(3) {background: url("images/icons/musicnote1.svg") no-repeat scroll 30px center #fff; } #tutors-london-sidebar h5.active:nth-of-type(3) {background: url("images/icons/musicnote12.svg") no-repeat scroll 30px center #F57036; border-right: 0 none; } #tutors-london-sidebar h5:nth-of-type(4) {background: url("images/icons/football1.svg") no-repeat scroll 30px center #fff; } #tutors-london-sidebar h5.active:nth-of-type(4) {background: url("images/icons/football12.svg") no-repeat scroll 30px center #F57036; border-right: 0 none; } #tutors-london-sidebar h5:nth-of-type(5) {background: url("images/icons/extra1.svg") no-repeat scroll 30px center #fff; border-right: 0 none; } #tutors-london-sidebar h5.active:nth-of-type(5) {background: url("images/icons/extra12.svg") no-repeat scroll 30px center #F57036; border-right: 0 none;} .nav_height-div { height: 134px; overflow: auto; width: 90%;} .nav_div { border-right: 1px solid rgb(221, 221, 221); display: block; max-height: 400px; margin-bottom:10px; padding-top: 20px;} .nav_div h2 { display: block; font-size:17px; margin: 0; padding: 0 0 15px; text-transform: uppercase; color:#d2d2d2; letter-spacing:1px; font-weight:300} .nav_div ul { display: block; margin: 0 !important; padding: 0 !important;} .nav_div ul li { display: block; font-family: arial; font-size: inherit !important; margin: 0 !important; padding: 0 !important;} .nav_div ul li a { display: block; font-family: inherit !important; font-size: 12px; padding: 5px 0 !important;} .full-modal .modal-dialog {width:100%; margin: 62px 0 0 0;} .full-modal .modal-content {box-shadow:none; border-radius:0px; background:#e5e5e5; border:none;} .full-modal .modal-backdrop.in {opacity: 0;} #wpcf7-f8797-o1 .form-group { float: left; margin: 5px -15px; width: 100%;} #wpcf7-f8797-o1 .form-group input[type="text"] { background: rgb(247, 247, 247) none repeat scroll 0 0; height: 50px; border-radius:0} #wpcf7-f8797-o1 .form-group input[type="email"] { background: rgb(247, 247, 247) none repeat scroll 0 0; height: 50px; border-radius:0} #wpcf7-f8797-o1 .form-group input[type="tel"] { background: rgb(247, 247, 247) none repeat scroll 0 0; height: 50px; border-radius:0} #wpcf7-f8797-o1 .form-group textarea { background: rgb(247, 247, 247) none repeat scroll 0 0; border-radius:0} #myModal .container { margin: auto; width: 800px;} .full-modal span.wpcf7-not-valid-tip { color: rgb(255, 0, 0); display: block; font-size: 1em; /* position: absolute; */ right: -250px; top: 0;} span.wpcf7-form-control-wrap { position: relative; display: block;} div.wpcf7-validation-errors { float:left; width:100%; } /* #myModal .close { border: 0.1em solid #2d3090; border-radius: 50%; color:#f36f2c; font-size: 30px; height: 50px; margin: 0 !important; opacity: 1; padding: 0 !important; position: absolute; right: 30px; text-align: center; text-shadow: none; width: 50px;} */ #myModal .close { opacity: 1; position: absolute; right: 30px; } #myModal .modal-title { color: rgb(45, 48, 144); font-size: 25px; font-weight: 600; line-height: 1.42857; margin: 0;padding: 0;} .right_check_block { display: block; text-align: center;} .right_check_block span { border: 2px solid #2d3090; border-radius: 50%; color:#f36f2c; display: inline-block; font-size: 40px; height: 100px; line-height: 100px; text-align: center; width: 100px;} #myModal1 .modal-body { text-align:center; } #myModal1 .close { border: 2px solid #2d3090; border-radius: 50%; color:#f36f2c; font-size: 30px; height: 50px; margin: 0 !important; opacity: 1; padding: 0 !important; position: absolute; right: 30px; text-align: center; text-shadow: none; width: 50px;} #myModal1 .modal-header h4 { display:none; } #myModal1 .modal-body h2 {color: rgb(45, 48, 144); display: block; padding: 20px 0; text-transform: uppercase;} div.wpcf7-mail-sent-ok {border: 2px solid rgb(57, 143, 20); float: left;width: 100%; } .you_know { color: rgb(136, 136, 136) !important; display: block; font-size: 23px !important; font-weight: 400; margin-bottom: 20px;} .you_might_know { display:block; text-align:center; } .you_might_know a img {display: inline-block; margin: 5px; max-width: 100%;} .you_might_know a img:hover { background-color: #000000; opacity:0.4 !important; } .fancybox-close { background: rgb(45, 48, 144); border: 2px solid rgb(255, 255, 255); border-radius: 50%; box-shadow: 0 0 2px rgba(0, 0, 0, 0.4);} .fancybox-close::before {bottom: 0;color: rgb(255, 255, 255); content: "X"; font-size: 20px; left: 0; margin: auto; position: absolute; right: 0; top: 2px; width: 12px;} h5.bs_head { border-bottom: 1px solid rgb(221, 221, 221); display: block; font-size: 20px; font-weight: 300; margin: 0; padding: 0 0 10px; text-transform: uppercase;} .sumome-share-client-hide{} /* section.grey .container {width: 100%;} */ .full-modal { padding-right: 0 !important; } .level_of_study ul{padding-left:15px;} .level_of_study ul li{padding:8px 0px;} .tutor_feedback {margin-left: 45px; margin-bottom: 20px; } .tutor_feedback .feedback_video1 iframe{width:100%;} @media(min-width:1121px) and (max-width:1220px){ .full-modal span.wpcf7-not-valid-tip { position:inherit; right:inherit; } } @media(min-width:1121px) and (max-width:1199px){ #tutors-london-sidebar h5 { background-size: 40px auto !important; font-size: 18px; padding-left: 60px;} .isotop-controls { top:56px; } .logo { height: 50px; margin-top: -14px;} #menu-top-menu,#mega-menu-wrap-main_nav{ margin-left:0; } } @media(min-width:992px) and (max-width:1120px){ #tutors-london-sidebar h5 { background-size:30px !important; font-size:12px; padding-left:50px; } .isotop-controls { top:56px; } .full-modal span.wpcf7-not-valid-tip { position:inherit; right:inherit; } .logo { height: 50px; margin-top: -14px;} #menu-top-menu,#mega-menu-wrap-main_nav{ margin-left:0; } } @media(min-width:992px) and (max-width:1199px){ #tutors-london-sidebar h5 { background-position: 10px 50% !important; background-size: 30px auto !important; font-size: 12px; min-width: 19.5%; padding-left: 50px;} #menu-top-menu,#mega-menu-wrap-main_nav li { padding: 0 7px;} .isotop-controls {top: 70px;} } @media(min-width:768px) and (max-width:991px){ .brand_photo { width:70%; } .years ul li { margin: 1%; width: 22%; } .press_headline_content::after { left:10%; } .news_with_date .date::after { right:-20px; } #tutors-london-sidebar h5 { background-position: 10px 50% !important; background-size: 30px auto !important; font-size: 12px; min-width: 19.5%; padding-left: 50px;} .isotop-controls { top:70px; padding:10px; } #myModal .container { width:100%; } #myModal1 .container { width:100%; } .full-modal span.wpcf7-not-valid-tip { position:inherit; right:inherit; } .social_top { float:left; } #menu-top-menu,#mega-menu-wrap-main_nav { margin:0; } #menu-top-menu,#mega-menu-wrap-main_nav li { padding:0 6px } } @media(max-width:767px){ .home .grey ul li{padding:7px 0px;} .social_top { border: 0 none; bottom: 20px; left: 0; position: absolute;} .press_headline_content::after { display:none; } .news_with_date .news_blocks { padding-left:0; } .news_with_date .date::after { display:none; } .news_with_date .news_blocks .news_box { margin:5px 0 } .years ul li {width:45%; } .brand_photo { width:96%; margin:0px auto } .brand_photo_box { margin-top:30px } #myModal .container { width:100%; } #myModal1 .container { width:100%; } .full-modal .modal-dialog { margin-top:0; } .full-modal .modal-header { padding:15px 0; } .full-modal .modal-body {padding:0;} #wpcf7-f8797-o1 .form-group { margin:5px 0; } #wpcf7-f8797-o1 .form-group .col-sm-9 { padding:0; } #wpcf7-f8797-o1 .form-group .col-sm-3 { padding:0; } .full-modal span.wpcf7-not-valid-tip { position:inherit; right:inherit; } .isotop-controls { position:inherit; top:inherit; float:left; padding:10px; max-height:inherit !important } #tutors-london-sidebar h5 { width:100%; border-right:0; border-bottom:1px solid #ddd; } .nav_div {max-height:inherit; border-bottom: 1px solid #ddd; border-right: 0 none;} #menu-top-menu,#mega-menu-wrap-main_nav li a { color: #ffffff;} #menu-top-menu,#mega-menu-wrap-main_nav {float: left !important; margin-left: 2%; width: 98%;} .nav_height-div { height: 134px;} .shakeimage_contaniner{margin-top:40px;} .shakeimage_contaniner br{display:none;} .shakeimage_contaniner_p{margin-top:-20px;} .padding_top_zero{padding-top:0px !important;} iframe{margin-top:20px;} .category_resources h2{margin-bottom:0px !important;} } @media (max-width: 767px) { .opening-hours-2 { padding-top: 16px; } .bounce{ left: 45% !important; } .btn-view-more{ width: 100% !important; } .search-form-tutors{ padding-top: 50px; } .padding-top-sidebar{ padding-top: 30px; border-bottom: 1px solid #ccc; padding-top: 30px; } #main article{ margin-bottom: 0px; padding-bottom: 0px; } /*.tutors-l-left{ position: absolute; top: 238%; } .tutors-l-right{ padding-top: 573px }*/ } @media (max-width: 767px) { .contact-map-overlay-1 { background: transparent; position: relative; align: center; width :100%; height: 135px; padding-top: 16px; } } @media (max-width: 767px) { .text-left-inline-1 { padding-left: 15px; padding-right: 15px; text-align: center; } } @media (max-width: 767px) { .title-center-1 { text-align: center; padding-right: 15px; padding-left: 15px; } } @media (max-width: 767px) { .page-title-1 { color: #2f0097; font-size: 24px; text-transform: uppercase; text-align: center; padding-right: 15px; padding-left: 15px; }} @media (max-width: 767px) { .arrow { margin: auto; width: 60%; padding: 25px; }} @media (max-width: 400px) { .opening-hours-2 { padding-top: 16px; } .bounce{ left: 41% !important; } } /* == 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: 100%; 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: 2px; 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: 4px; 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: #000; background-color: rgba(0,0,0,0.4); filter: "alpha(opacity=40)"; -ms-filter: "alpha(opacity=40)"; } .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background-color: #F57036; } .mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #F57036; } .mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #F57036; } .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: 1; } .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: #F57036; } .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); } /* ---------------------------------------- */ ::-webkit-file-upload-button { border: 3px solid #e26424; background: #fff; color: #f36f2c; font-size: 16px; text-transform: uppercase; letter-spacing: 2px; border-radius: 3px; padding: 12px 39px; cursor: pointer; font-weight: bold; } ::-webkit-file-upload-button:hover { border: 3px solid #e26424; background: #e26424; color: #fff; font-size: 16px; text-transform: uppercase; letter-spacing: 2px; border-radius: 3px; padding: 12px 39px; cursor: pointer; font-weight: bold; } input[type="file"]::-webkit-file-upload-button { border: 3px solid #f36f2c; background: #fff; color: #f36f2c; padding: 12px 39px; font-size: 16px; } input[type="file"]::-webkit-file-upload-button:hover { border: 3px solid #e26424; background: #e26424; color: #fff; padding: 12px 39px; font-size: 16px; } #menu-top-menu,#mega-menu-wrap-main_nav li:nth-child(2) li:nth-child(2) ul li { /* float: left !important; width: 199px !important;*/ } #menu-top-menu,#mega-menu-wrap-main_nav li:nth-child(2) li:nth-child(2) ul { /* width: 402px !important;*/ } #menu-top-menu,#mega-menu-wrap-main_nav li:nth-child(2) li:nth-child(4) ul li { /* float: left !important; width: 199px !important;*/ } #menu-top-menu,#mega-menu-wrap-main_nav li:nth-child(2) li:nth-child(4) ul { /* width: 603px !important;*/ } .rightcont { float: left; width: 100px; } .rightcont img { width: 100px;height:100px } .leftcont { float: left; width: 220px; } .leftcont h3 { margin: 0px 0px 10px; font-size: 16px; } .leftcont p { font-size: 13px; line-height: 14px; } .maindata { display: inline-block; padding: 10px 0px; border-bottom: 1px solid #ccc; } .category-636 .page-title { display: none; } .category-636 #content { display: none; } .category-636 form.form-inline.search-tutors-form { display: none; } .category-636 form.form-inline { display: none; } header p img { float: left; padding: 0 20px 20px 0; width: 50%; } .col-sm-24{ width: 20%; float: left; } .tutors-l-left .maindata{ width: 100%; } .tutors-l-left .maindata .leftcont{ float: left; width: 60%; } .tutors-l-left .maindata .rightcont{ float: right; width: 40%; } .tutors-l-left .maindata .rightcont img{ height: 90px; width: 100%; } /*Arrow Bounce*/ @import url(http://weloveiconfonts.com/api/?family=fontawesome); .bounce .fa { width: 60px; display: block; text-align: center; color:#f36f2c; font:normal 45px 'FontAwesome'; line-height:60px; text-rendering: auto; -webkit-font-smoothing: antialiased; } .bounce .fa-angle-double-down:before {content: "\f103";} .bounce { position: fixed; left: 48% ; width: 60px; height: 60px; z-index: 99999999999; /* bottom: 30px; margin-left:-30px; bottom: -60px; border: 2px solid #990000; -webkit-border-radius:50%; -moz-border-radius:50%; -ms-border-radius:50%; border-radius:50%;*/ animation: bounce 2s infinite; -webkit-animation: bounce 2s infinite; -moz-animation: bounce 2s infinite; -o-animation: bounce 2s infinite; margin: 0 auto; } @-webkit-keyframes bounce { 0%, 20%, 50%, 80%, 100% {-webkit-transform: translateY(0);} 40% {-webkit-transform: translateY(-30px);} 60% {-webkit-transform: translateY(-15px);} } @-moz-keyframes bounce { 0%, 20%, 50%, 80%, 100% {-moz-transform: translateY(0);} 40% {-moz-transform: translateY(-30px);} 60% {-moz-transform: translateY(-15px);} } @-o-keyframes bounce { 0%, 20%, 50%, 80%, 100% {-o-transform: translateY(0);} 40% {-o-transform: translateY(-30px);} 60% {-o-transform: translateY(-15px);} } @keyframes bounce { 0%, 20%, 50%, 80%, 100% {transform: translateY(0);} 40% {transform: translateY(-30px);} 60% {transform: translateY(-15px);} } .btn-view-more{ width: 103px; } h2{ text-transform: uppercase !important; } .feedback_video{margin-left:60px; margin-bottom:20px;} .feedback_video .col-sm-6,.feedback_video .col-sm-4,.feedback_video .col-sm-3{padding-left:0px !important;} .category_description{padding-top:10px;} .category_description h2,.post_content h2{text-align:center;} .category_description p{margin-bottom:10px !important;} .sub_cat_list{text-align:center; width:100%; margin:0 auto;} .category_description .btn.btn-primary.btn-sm.btn-margin { font-size: 10px !important; /*width: 286px; max-width:100%; */ display:inline-block; white-space:normal; } #content .bounce{position:absolute !important;} .student_testi_box1 > h2 { color: #f36f2c; font-size: 25px; } .student_testi_box1 { text-align: left; } .student_testi_box1 > img { padding-left: 20%; width:105px; } .student_testi_box > h4 { color: #f36f2c; font-size: 18px; } .student_testi_box > p { color: #585858; font-size: 14px !important; margin: 32px 0px; } .student_testi_box { background: #fff none repeat scroll 0 0; padding: 25px 6%; border: 1px solid #dedede; border-radius: 3px; margin: 0px 1%; } .new_cat_desc h2{text-align:center;} .scroll_for {color:#efefef; text-transform:uppercase; width:100%; text-align:center; font-size:20px;} .student_testi_box .review_date span{color: #f36f2c;} .email_box > h3,.map_box > h3,.time_box > h3,.phone_box > h3{font-size:15px; font-weight:bold; margin-bottom: 0; padding-bottom: 0;} .email_box > span:first-child,.map_box p span:first-child,.time_box > span:first-child{color:#f36f2c;} .email_box {background:url(images/new_icon/i3.svg) left top 7px no-repeat; padding-left:42px; background-size:28px;} .map_box{background:url(images/new_icon/i1.svg) left top 8px no-repeat; padding-left:42px; background-size:28px;} .phone_box {background:url(images/new_icon/i4.svg) left top 5px no-repeat; padding-left:42px; background-size:28px;} .time_box {background:url(images/new_icon/i2.svg) left top 7px no-repeat; padding-left:42px; background-size:28px;} .container.tutor_contact_box { border: 1px solid #dddddd; padding: 10px 3% 32px; } .tutor_subject > h2,.col-sm-2.tutor_language.col-half-offset > h2,.col-sm-2.tutor_music.col-half-offset > h2,.col-sm-2.tutor_sports.col-half-offset > h2,.tutor_additional > h2 { color: #585858; font-size: 18px; font-weight: lighter; margin-bottom: 25px; min-height:38px; } .btn-view-more_sub { border: 3px solid #f36f2c; border-radius: 2px; color: #f36f2c; font-size: 16px; font-weight: 200; padding: 9px 15px; text-transform: uppercase; } .btn-view-more_sub:hover { color: #fff; background: #f36f2c; text-decoration:none; } .btn-view-more_press{ border: 3px solid #f36f2c; border-radius: 2px; color: #f36f2c; font-size: 16px; font-weight: 200; padding: 9px 40px; text-transform: uppercase; } .btn-view-more_press:hover { color: #fff; background: #f36f2c; text-decoration:none; } .press_link{text-align:center; width:100%; margin-top:10px;} .tutor_subject a:hover,.col-sm-2.tutor_language.col-half-offset a:hover,.col-sm-2.tutor_music.col-half-offset a:hover,.col-sm-2.tutor_sports.col-half-offset a:hover,.tutor_additional a:hover{text-decoration:none;} .tutor_subject > a h5{ background: url("images/icons/book1234.svg") top center no-repeat ; background-size:56px 53px; height:60px; } .col-sm-2.tutor_language.col-half-offset h5 { background: url("images/icons/speach12.svg") top center no-repeat ; background-size:56px 53px; height:60px; } .col-sm-2.tutor_music.col-half-offset h5 { background: url("images/icons/musicnote1.svg") top center no-repeat ; background-size:56px 53px; height:60px; } .col-sm-2.tutor_sports.col-half-offset h5 { background: url("images/icons/football1.svg") top center no-repeat ; background-size:56px 53px; height:60px; } .tutor_additional h5{ background: url("images/icons/extra1.svg") top center no-repeat ; background-size:56px 53px; height:60px; } .form-inline_new .form_label{ display: block; float: left; font-size: 20px; font-weight: bold; text-transform: uppercase; padding-top:24px; width: 100%; } .form-inline_new .twitter-typeahead { border: 0 none !important; float: left; max-width: 100%; } .form-inline_new .btn.btn-warning.btn-lg.btn-block { font-size: 15px; font-weight: bold; margin-top: 7px; padding: 6px 6px !important; } .form-inline_new .col-sm-9 { padding-left:13%; height:auto; overflow:hidden; } .form-inline_new .col-sm-3 { padding-left:0px; padding-right:0px; text-align:right; } .form-inline_new .typeahead.form-control.width100.tt-input { border-radius: 0 !important; font-size: 20px; color: #949494; text-align: center; background: #f7f7f7 !important; border: 0 none !important; border-top: 0px !important; border-bottom: 1px solid #dddddd !important; box-shadow:none !important; } .search_grey{padding:0px !important;} .student_bottom { overflow-wrap: break-word; } .form-inline_new.form-inline.search-tutors-form{ display:block !important;} .bottom_menu_list .col-md-3 > h2 { font-size: 15px; padding: 8px 15px 4px; border-top: 1px solid #dddddd; border-bottom: 3px solid #dddddd; margin:0px; } .bottom_menu_list ul{list-style:none !important; padding-left:0px !important;} .bottom_menu_list ul li{list-style:none !important; border-bottom: 1px solid #dddddd; padding: 4px 15px 4px !important;} .mega-menu-wrap{clear:none !important;} .mega-menu-wrap { float: left !important; margin-left: 0 !important; clear: none !important; margin-left:2% !important; } .mega-menu-link { text-transform: uppercase !important; font-size: 12px !important; background:none !important; } .mega-menu.mega-menu-horizontal { margin: 0 !important; padding: 0 !important; } #mega-menu-wrap-main_nav #mega-menu-main_nav li.mega-menu-flyout.mega-menu-item-has-children > a.mega-menu-link::after, #mega-menu-wrap-main_nav #mega-menu-main_nav li.mega-menu-flyout li.mega-menu-item-has-children > a.mega-menu-link::after, #mega-menu-wrap-main_nav #mega-menu-main_nav > li.mega-menu-item-has-children > a.mega-menu-link::after{display:block !important;} .mega-menu.mega-menu-horizontal { min-height: 62px !important; } .mega-menu-wrap li{padding:0px 8px !important;} .mega-menu-link { padding-top: 10px !important; padding-left: 0 !important; padding-right: 0 !important; } .mega-sub-menu { margin-top: 21px !important; } .mega-view_more_menu > a,#mega-menu-item-10152 > a,#mega-menu-item-9512 > a,#mega-menu-item-10153 > a,#mega-menu-item-10158 > a,#mega-menu-item-10168 > a,#mega-menu-item-10183> a,#mega-menu-item-10188 > a{color:#f36f2c !important; font-weight:600 !important; border-top:0px !important;} .mega-menu_heading >a {font-weight:bold !important; margin-top:20px !important; color:#2d3090 !important; font-size:15px !important;} .mega-menu_heading_bottom > a,#mega-menu-item-10154 > a,#mega-menu-item-10164 > a{font-weight:bold !important; padding-top:20px !important; padding-bottom:20px !important; color:#2d3090 !important; text-transform:uppercase !important; font-size:15px !important;} .sub_cat_list ul li{text-align:left !important;} .search-form-tutors .twitter-typeahead .twitter-typeahead:first-child,.search-form-tutors_top .twitter-typeahead .twitter-typeahead:first-child{display:none !important;} .search-form-tutors_top { position: absolute; top: 211px; background-color: rgba(0, 0, 0, 0.5); width: 100%; margin: 0 auto; left: 0% !important; border-radius:3px; min-height:65px; } .search-form-tutors_top .form_label{color:#fff;} .search-form-tutors_top .search_bottom_frm{display:none !important;} .search-form-tutors_top .col-sm-6{margin-top: 8px;} .search-form-tutors_top .btn-warning { margin-top: 10px !important; padding: 6px !important; font-size: 17px !important; } .search-form-tutors_top .form-inline_new .typeahead.form-control.width100.tt-input{height:42px; margin-top:1px; text-align:left;} .narrow_content{float:none; margin:0 auto;} @media screen and (min-width: 1024px) { .mega-menu-wrap { max-width: 74%; } .mega-tutor_menu_list .mega-sub-menu{margin-left: -32% !important; width: 148% !important; padding-bottom:20px !important;} .mega-tutor_menu_list .mega-menu_heading >ul{margin-left: 0% !important; width: 100% !important; padding-bottom:0px !important;} } @media screen and (min-width: 768px) and (max-width: 1100px) {.mega-sub-menu{width:125% !important;}} @media screen and (min-width: 768px) { .tutor_list_new .col-sm-2{width:19.667% !important;} .tutor_subject{padding-left:3%;} #mega-menu-main_nav> li> ul{box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19) !important; border-top:3px solid #ed9040 !important; } .navbar-default .navbar-nav,.mega-menu-wrap li a { color: #585858 !important; border-top: 2px solid #ffffff !important; } .navbar-default .navbar-nav,.mega-menu-wrap li a:hover, .navbar-default .navbar-nav,.mega-menu-wrap li a:focus { color: #585858 !important; border-top: 2px solid #ed9040 !important; } #mega-menu-wrap-main_nav #mega-menu-main_nav li.mega-menu-flyout.mega-menu-item-has-children > a.mega-menu-link:after, #mega-menu-wrap-main_nav #mega-menu-main_nav li.mega-menu-flyout li.mega-menu-item-has-children > a.mega-menu-link:after, #mega-menu-wrap-main_nav #mega-menu-main_nav > li.mega-menu-item-has-children > a.mega-menu-link:after {content:"" !important;} .mega-sub-menu { min-width: 230px; background:#fff !important; } .mega-sub-menu li a{line-height:20px !important; border-top:0px !important; padding-top:5px !important; padding-bottom:5px !important; } .mega-sub-menu li a:hover{border-top:0px !important; /* color:#f3702b !important;*/} .mega-sub-menu li { border-bottom:2px solid #ddd !important; } .mega-sub-menu { border-top:2px solid #ed9040 !important; } .mega-menu-megamenu .mega-sub-menu { border-top:0px !important; } .mega-menu-megamenu .mega-sub-menu li { border-bottom:0px !important; } .mega-menu-megamenu .mega-menu-item-type-custom>a{padding-left:15px !important; color:#2d3090 !important; } .mega-menu-megamenu .mega-menu-item-type-custom>a:hover{color:#2d3090 !important;} .mega-menu-megamenu .mega-menu-item-type-custom .mega-sub-menu li >a{padding-left:10px !important; color:#585858!important; } .mega-menu-megamenu .mega-menu-item-type-custom .mega-sub-menu li >a:hover{/*color:#f3702b!important; */ } .form-inline_new .btn.btn-warning.btn-lg.btn-block { max-width: 212px; } } @media screen and (max-width: 1279px) { .mega-menu-link{font-size:9px !important;} .mega-menu-wrap{margin-left:-10px !important;} .form-inline_new .btn.btn-warning.btn-lg.btn-block{font-size:16px;} .form-inline_new .form_label{font-size:17px;} .student_testi_box1{text-align:center;} .mega-sub-menu{min-width:215px;} .student_testi_box1 > img{padding-left:0px !important;} } @media screen and (max-width: 990px) { .btn-view-more_sub{font-size:12px; padding:9px 5px;} .tutor_subject > h2, .col-sm-2.tutor_language.col-half-offset > h2, .col-sm-2.tutor_music.col-half-offset > h2, .col-sm-2.tutor_sports.col-half-offset > h2, .tutor_additional > h2{font-size:12px; min-height:26px;} .rightcont img{height:70px; width:70px;} .form-inline_new .form_label{font-size:14px; text-align:center; width:100%; float:none;} .container{width:100% !important;} p.lead{font-size:13px !important;} } @media screen and (max-width: 800px) { .level_of_study{padding-left:15px; padding-right:15px;} .student_testi_box {margin-bottom:5px;} .form-inline_new .form_label{font-size:14px; text-align:center; width:100%; float:none;} .form-inline_new .btn.btn-warning.btn-lg.btn-block{font-size:12px;} .col-sm-2.tutor_language.col-half-offset h5,.col-sm-2.tutor_music.col-half-offset h5,.col-sm-2.tutor_sports.col-half-offset h5,.tutor_additional h5,.tutor_subject > a h5 { margin-top: 20px; } } @media screen and (max-width: 767px) { .search-form-tutors_top{top:110px;} .search-form-tutors_top .btn-warning { font-size:14px !important; display: block; width: auto !important; text-align: center; margin: auto;} p.lead{font-size:18px !important;} .col-sm-24{float:none !important; width:100% !important; margin-top:63px;} .js-same-height{height:27px !important; margin-top:10px !important;} .home .grey .container .js-same-height{height:auto !important; margin-top:0px !important;} .home .grey .container .col-sm-4 br{display:none !important;} .home .grey .container .col-sm-4 h3{margin-top:8px; margin-bottom:2px;} .home .grey .container .col-sm-4 .btn-primary{margin-bottom:10px !important;} .home .grey .container .img-responsive{margin-top:20px;} .btn-view-more_sub{font-size:12px; padding:9px 5px; clear:both; margin:0 auto; margin-bottom:45px; clear:both; max-width:110px; display:block} .tutor_subject > h2, .col-sm-2.tutor_language.col-half-offset > h2, .col-sm-2.tutor_music.col-half-offset > h2, .col-sm-2.tutor_sports.col-half-offset > h2, .tutor_additional > h2{font-size:12px; min-height:10px; margin-bottom:15px; margin-top:10px;} .typeahead.form-control.width100.tt-input { margin-bottom: 20px; } .sub_cat_list ul li{text-align:center !important; padding:10px 0px;} .navbar-default .navbar-nav,.mega-menu-wrap li a { color: #fff !important; border-top: 0px !important; } #mega-menu-wrap-main_nav{margin-top:10px !important;} ul.mega-sub-menu{background:none !important; margin-top:0px !important; margin-left:5px !important;} .mega-sub-menu li{float:none !important; width:100% !important; clear:both !important;} .mega-sub-menu li {padding:0px !important; padding-top:8px !important; padding-bottom:8px !important;} .mega-menu_heading_bottom > a, #mega-menu-item-10154 > a, #mega-menu-item-10164 > a{padding-top:0px !important; padding-bottom:0px !important;} .mega-sub-menu li a,.mega-sub-menu .mega-menu-link{padding:0px !impotant; padding-top:0px !important; padding-bottom:0px !important; line-height:20px !important;} .mega-sub-menu li a:before,.mega-sub-menu .mega-menu-link:before{content: "-" !important; display:inline-block !important;} .mega-menu-wrap{max-width:100%;} .mega-menu-wrap{background:#2d3090 !important;} .social_top{bottom:9px !important;} .mega-menu-link{font-size:12px !important;} #mega-menu-item-10164 { margin-top: 20px !important; } .mega-menu_heading_bottom > a, #mega-menu-item-10154 > a, #mega-menu-item-10164 > a{color:#fff !important;} #mega-menu-wrap-main_nav, #mega-menu-wrap-main_nav #mega-menu-main_nav, #mega-menu-wrap-main_nav #mega-menu-main_nav ul.mega-sub-menu, #mega-menu-wrap-main_nav #mega-menu-main_nav li.mega-menu-item, #mega-menu-wrap-main_nav #mega-menu-main_nav a.mega-menu-link{width:100% !important;} .leftcont{width:81%;} .rightcont{width:19%;} .leftcont h3{font-size:14px;} .leftcont p{font-size:12px;} .email_box {background:url(images/new_icon/i3.svg) left 35% top 7px no-repeat; padding-left:0px; text-align:center; background-size:28px;} .map_box{background:url(images/new_icon/i1.svg) left 35% top 8px no-repeat; padding-left:0px; text-align:center; background-size:28px;} .phone_box {background:url(images/new_icon/i4.svg) left 35% top 5px no-repeat; padding-left:0px; text-align:center; background-size:28px;} .time_box {background:url(images/new_icon/i2.svg) left 31% top 7px no-repeat; padding-left:0px; text-align:center; background-size:28px;} .form-group-lg .col-sm-3{clear:both;} } @media screen and (max-width: 639px) { .email_box {background:url(images/new_icon/i3.svg) left 20% top 7px no-repeat; padding-left:0px; text-align:center; background-size:28px;} .map_box{background:url(images/new_icon/i1.svg) left 20% top 8px no-repeat; padding-left:0px; text-align:center; background-size:28px;} .phone_box {background:url(images/new_icon/i4.svg) left 20% top 5px no-repeat; padding-left:0px; text-align:center; background-size:28px;} .time_box {background:url(images/new_icon/i2.svg) left 13% top 7px no-repeat; padding-left:0px; text-align:center; background-size:28px;} .contact-info-mail, .contact-info-phone{display:block;} } @media screen and (max-width: 360px) { .js-same-height{height:40px !important;} .home .grey .container .js-same-height{height:auto !important; margin-top:0px !important;} .home .grey .container .col-sm-4 br{display:none !important;} .home .grey .container .img-responsive{margin-top:20px;} .category_description .btn.btn-primary.btn-sm.btn-margin { font-size: 8px !important; width: 286px; max-width:100%; } .email_box {background:url(images/new_icon/i3.svg) left 18% top 7px no-repeat; padding-left:0px; text-align:center; background-size:28px;} .map_box{background:url(images/new_icon/i1.svg) left 18% top 8px no-repeat; padding-left:0px; text-align:center; background-size:28px;} .phone_box {background:url(images/new_icon/i4.svg) left 18% top 5px no-repeat; padding-left:0px; text-align:center; background-size:28px;} .time_box {background:url(images/new_icon/i2.svg) left 10% top 7px no-repeat; padding-left:0px; text-align:center; background-size:28px;} } @media screen and (max-width: 320px) { .email_box {background:url(images/new_icon/i3.svg) left 16% top 7px no-repeat; padding-left:0px; text-align:center; background-size:28px;} .map_box{background:url(images/new_icon/i1.svg) left 16% top 8px no-repeat; padding-left:0px; text-align:center; background-size:28px;} .phone_box {background:url(images/new_icon/i4.svg) left 16% top 5px no-repeat; padding-left:0px; text-align:center; background-size:28px;} .time_box {background:url(images/new_icon/i2.svg) left 6% top 7px no-repeat; padding-left:0px; text-align:center; background-size:28px;} } .bounce{z-index:1 !important;}