// Core variables and mixins /*Core variables and mixins*/ @import "variables.less"; // Modify this for custom colors, font-sizes, etc @import "mixins.less"; // template stylization ul {list-style-type:none;} *, a:focus {outline:none !important;} #content{ min-width: 980px; } /*------ template stylization ------*/ body { min-width: 767px; color: #666666; } h1, h2, h3, h4, h5, h6 { margin:0; line-height: 1em; color: @headingsColor; text-rendering: optimizelegibility; small { font-weight: normal; line-height: 1; color: @grayLight; } } h1 { font-size:36px; line-height:1.1em; color:@grayDark; } h2 { color: @black; font-size: 27px; font-weight: normal; padding: 39px 0 19px; small{ font-size: 14px; } } h3 { color:@grayLight; font-size: 24px; font-weight: normal; padding: 34px 0 29px; } h4{ font-size: 16px; line-height: 18px; color:@black; font-weight:normal; padding:30px 0 18px } h6{font-weight:bold;color:#010101;font-size:13px;margin:0;padding:19px 0 2px} h5{margin:0;line-height:18px;font-size:13px } .container-fluid{ max-width: 1170px; margin: 0 auto; } // Buttons .btn { background:#fafafa; display:inline-block; .border-radius(@radius); .box-shadow(@shadow); font-size:13px; line-height:1em; color:@grayDark; font-weight:bold; text-decoration: none; padding: 9px 16px 10px 16px; margin:0; .transition(none); } .top-indent { margin-top: 20px; } p{padding-bottom:9px;margin:0} .overfow{overflow:hidden} .img-indent{float:left;margin:13px 30px 27px 0} .img-indent1{margin:0;display:inline-block} .img-indent2{margin:30px 0 0 ;} figure.img-polaroid{ text-align: center; display: block; margin-left: auto; margin-right: auto; } .img-container{ display: block; text-align: center; } .link-1{text-decoration:underline; &:hover{text-decoration:none} } p strong{color:#010101;} /*------ header ------- */ header{ background:#fcfcfc; padding:14px 0 0px; h1{ margin:2px 0 0 67px; a{ color: #3a3a3a; } } .brand{text-indent:-1000px; background:url(/help/wp-content/logo.png) no-repeat 0 0;.size(85px,375px);display:block} h1{text-align: center;} } /*------ content ------- */ #content { background:url(../img/tail-content.gif); border-top:1px solid #e1e1e1; border-bottom:1px solid #d7d7d7; padding-bottom:36px; .bg-content-top{background:url(../img/tail-content-top.gif) repeat-x 0 0 ;padding-top:44px} ul{list-style:none} } /*------ bs-docs-sidenav ------- */ #nav_container{ background: @white; border-top: 1px solid #ccc; .border-radius(6px); .box-shadow(0 2px 1px 1px rgba(0,0,0,.1)); padding-bottom: 18px; } #affect_all{ padding: 2px 0 8px 0; float: none; text-align: center; color: @gray; display: block; height: 12px; .border-radius(6px 6px 0 0); &:hover{ color: @linkColor; } i{ &:before{ font-size: 18px; } } .close, .expand{ position: relative; i{} } .close{ display: none; } .close{ [class*="-up"]{} [class*="-down"]{} } .expand{ [class*="-up"]{} [class*="-down"]{} } } #nav_container{ width: 270px; } .bs-docs-sidenav.affix, #nav_container.affix { top: 40px; } #content{ .bs-docs-sidenav{ li{ a{ width: inherit; } } } } .bs-docs-sidenav { // border-top:1px solid #ccc; width: 100%; margin:0; padding:0; background-color: @white; // .border-radius(6px); // .box-shadow(0 2px 1px 1px rgba(0,0,0,.1)); >li{ border-top:1px solid #dfdfdf; padding:0 } li dt a:hover, li.current >a{ text-shadow:none; color:#3a3a3a; } li{ dt{ overflow: hidden; &:hover{ background:#f5f5f5; } a{ font-family: @sansFontFamily; display: block; width: inherit; &:before{ font-family: 'FontAwesome'; } } i{ float: right; margin-right: 12px; font-size: 10px; font-weight: normal; color: #999999; display: block; position: relative; z-index: 20; padding: 5px; top: 7px; cursor: pointer; &:before { content: "\f067"; } } a{ float: left; } } &.act_item{ dt{ background:#f5f5f5; a{ &:before{ color: @themeBlue; } } } } &.open_item{ dt{ i{ &:before { content: "\f068"; } } } } &.current{ .slide-down{ dd{ display: block; } } } } .slide-down{ dd{ display: none; } } li.act_item.last{ dl.slide-down{ // .border-radius(0 0 6px 6px); } } li.act_item.first{ dl.slide-down{ // .border-radius(6px 6px 0 0); } } .slide-down{margin:0} .slide-down dd{margin:0} >li:first-child{border:none;} >li:hover{} li dt a, >li> a{ padding:10px 0 10px 43px; display:block; font-weight:bold; margin:0; position:relative; font-size:13px; color:#3a3a3a; &:before{ position: absolute; left: 14px; font-size: 20px; -webkit-font-smoothing: antialiased; } } li.first dt{ border-top:1px solid #dfdfdf; // .border-radius(6px 6px 0 0); } li.last dt{ border-bottom:1px solid #dfdfdf; // .border-radius(0 0 6px 6px); } // li.item1 dt a:before {background:url(../img/nav-icon1.png) no-repeat 0 0;.size(21px, 30px)} // li.item2 a:before {background:url(../img/nav-icon2.png) no-repeat 0 0;.size(21px, 25px)} // li.item3 a:before {background:url(../img/nav-icon3.png) no-repeat 0 0;.size(21px, 25px)} // li.item4 a:before {background:url(../img/nav-icon4.png) no-repeat 0 0;.size(21px, 28px)} // li.item5 a:before {background:url(../img/nav-icon5.png) no-repeat 0 0;.size(18px, 28px)} // li.item6 a:before {background:url(../img/nav-icon6.png) no-repeat 0 0;.size(17px, 30px)} // li.item7 a:before {background:url(../img/nav-icon7.png) no-repeat 0 0;.size(21px, 25px)} // li.item8 a:before {background:url(../img/nav-icon8.png) no-repeat 0 0;.size(24px, 25px)} // li.item9 a:before {background:url(../img/nav-icon9.png) no-repeat 0 0;.size(22px, 25px)} // li.item10 a:before {background:url(../img/nav-icon10.png) no-repeat 0 0;.size(18px, 25px)} .list{ margin:0; padding:8px 0 6px 20px ; li{ padding: 0 20px 10px 7px; a{ i{ margin-right: 8px; &:before { content: "\f0da"; font-size: 12px; color: #999999; } } } } li.current { a, i:before{ color:@themeBlue; background:none; &:hover{ color:#000; } } } a{ color:@grayDark; &:hover{ color:#000; i:before{ color:#000; } } } } } .lang_label { display: inline-block; padding-right: 6px; position: relative; top: 8px; } #lang_icon{ border: 1px solid #dfdfdf; display: inline-block; background: #fff; padding: 6px 12px; cursor: pointer; position: relative; top: 8px; b{ display: inline-block; margin-right: 6px; } &:hover{ background: #f5f5f5; } } #lang_list{ display: none; position: absolute; top: 43px; right: 0; background: #f5f5f5; border: 1px solid #dfdfdf; } .languages{ position: relative; ul{ li{ list-style: none; display: block; width: 90px; padding: 6px 12px; font-size: 12px; line-height: 20px; margin-bottom: 1px; &.active, &:hover{ background: #fff; a{ color: #df152b; } } a{ display: block; overflow: hidden; clear: both; } span{ display: block; float: left; } img{ display: block; float: right; position: relative; top: 3px; } } } } /*------ box-conten ------- */ .box-content{ border-top:1px solid #ccc; background-color: @white; .border-radius(6px); .box-shadow(0 2px 1px 1px rgba(0,0,0,.1)); section{ padding: 0 33px 25px; border-bottom:1px solid #ccc } } #mod_table{ .module{ .box-sizing(border-box); padding: 10px; } .module:nth-child(even){ background: #f5f5f5; } } .files_structure{ li{ i{ color: #999999; } } } #section-2{ padding:7px 48px 71px 33px; } .img-paraloid{padding:5px;background:#f5f5f5;border:1px solid #cecece;.border-radius(5px);.box-shadow(0 1px 1px rgba(0,0,0,0.1)) } .list-1{ margin:10px 0 0 ; list-style:decimal; padding-left:20px; li{line-height:18px;padding-bottom:6px;} strong{color:#010101;} } .box-info, .box-error, .box-notification{position:relative; margin-bottom:38px; padding:15px 30px 15px 94px; .box-sizing(border-box); min-height:74px; span{font-size:15px; line-height:20px;color:@white;vertical-align:middle;display:table-cell;height:40px} &:before{position:absolute;top:15px;left:15px;.size(44px, 43px);content:""} } .box-info{#gradient >.vertical(#3383c8,#2b74b4); &:before{background:url(../img/icon-1.png) no-repeat 0 0;} } .box-error{#gradient >.vertical(#c93737,#c93737); padding:26px 30px 25px 94px; &:before{background:url(../img/icon-2.png) no-repeat 0 0;top:25px} } .box-notification{ margin-bottom:0; #gradient >.vertical(#ffa800,#f8970f); &:before{background:url(../img/icon-3.png) no-repeat 0 0;} } .btnDisabled{position:absolute;top:0;left:0; width:100%;height:100%; span{background:url(../img/btn-size.png) no-repeat 50% 50%; .square(45px); display:block;} } .magnifier { opacity: 1; position: relative; background:url(../img/tail-lightbox-hover.png); height: auto; display:block; .transition(all 0.3s ease) } .magnifier:hover { } .magnifier:after { content: ''; display: block; width: 100%; height: 100%; position: absolute; opacity: 0; left: 0; top: 0; background:url(../img/btn-size.png) no-repeat 50% 50%; .transition(all 0.3s ease) } .magnifier:hover:after { opacity: 1; } .iframe {padding:13px 0 0 82px} footer{text-align:center;font-size:13px;line-height:20px;background:@white;padding:30px 0 40px} /*======================= SCROLL TO TOP =======================*/ #back-top {position: fixed; bottom: 135px; right: 20px; z-index: 99} #back-top a { width: 51px; display: block; /* transition */ -webkit-transition: 0.1s; -moz-transition: 0.1s; transition: 0.1s; color:#666666; background: #fff; text-align: center; border: 1px solid #dfdfdf; height: 51px; &:hover{ background: #f5f5f5; } i{ line-height: 51px; font-size: 27px; } } /*new-styles*/ .notification-box { background: url(../img/icon-note.png) no-repeat scroll 20px 50% #FDEBAE; border: 1px solid #E6C555; border-radius: 5px 5px 5px 5px; color: #9E660D; font-family: Arial,Helvetica,sans-serif; font-size: 0.91em; font-weight: bold; line-height: 1.4em; margin-bottom: 20px; margin-top:10px; padding: 30px 30px 30px 90px; } .error-box { background: url(../img/icon-error.png) no-repeat scroll 20px 50% #FFCCCC; border: 1px solid #FF9999; border-radius: 5px 5px 5px 5px; color: #C31B00; font-family: Arial,Helvetica,sans-serif; font-size: 0.91em; font-weight: bold; line-height: 1.4em; margin-bottom: 20px; margin-top:10px; padding: 30px 30px 30px 90px; } .cols { margin: 30px 0; overflow: hidden; } .cols a { display: block; float: left; margin-right: 30px; } .cols-1 { margin: 0; padding:30px 0; overflow: hidden; text-align:center; a {display:inline-block;} } article .inner { padding:0; } .code-pad {padding-top:20px; display:block;} pre, code, samp, kbd, var{font:100% mono-space,monospace;} pre{ margin:0; padding:10px; overflow:auto; background:#fff; border:1px dashed #000 } .code { background:#eee; padding:10px; margin: 20px 0 20px 0; } /*--------------------*/ /*------------------------*/ #contact-form { width: 300px; position:relative; } #contact-form label{ position:relative; /*!*/ display:block; min-height:43px; } #contact-form span { display: block } #contact-form ._placeholder{ position:absolute; /*!*/ left:0; right:0; top:0; bottom:0; cursor:text; color: #666; padding:0px 10px; opacity:.99; font-family:Arial; font-size:12px; .border-radius(4px); line-height: 33px; display: block; } #contact-form ._placeholder.focused{ opacity:.4; filter:alpha(opacity=40); .box-shadow(0px 0px 7px 0px rgba(0, 0, 255, 0.5)); } #contact-form ._placeholder.hidden{ display:none; } #contact-form input,#contact-form textarea{ outline:none; .box-shadow(inset 0px 0px 10px 0px rgba(0, 0, 0, 0.2)); .box-sizing(border-box); float:left; .border-radius(4px); padding: 8px 10px 7px 10px; font-size:12px; line-height:15px; font-family:Arial; border:1px #ccc solid; width:300px; height:33px; background: #fff; color: #000; } #contact-form textarea {height:64px;} #contact-form .error-message, #contact-form .empty-message{ height:0; overflow:hidden; font:10px/20px Arial; .transition(.3s ease-in height); position:absolute; right:3px; top:0; } #contact-form .invalid .error-message, #contact-form .empty .empty-message{ height:20px;} #contact-form .success-message{ line-height:48px; position:absolute; overflow:hidden; height:0; left:0; top:0; .box-sizing(border-box); .box-shadow(inset 0px 0px 10px 0px rgba(0, 0, 0, 0.2)); .border-radius(4px); background:#fff; z-index:10; width:100%; text-align:center; .transition(all .7s linear); padding: 0px 0; } #contact-form.success .success-message{ height: 270px; padding: 115px 0; border:1px #ccc solid; .transition(all .7s linear); } #contact-form a { display:inline-block; .box-shadow(0px 0px 5px 0px rgba(0, 0, 0, 0.2)); .border-radius(4px); padding: 6px 15px; font-size:12px; font-family:Arial; border:1px #ccc solid; background: #f5f5f5; color: #000; margin-top:10px;} #contact-form a:hover {background: #efefef;} /*-------------------*/ /*search*/ #search { text-align:left; margin:20px 0 5px 0; } #search input[type=text] { outline:none; .box-shadow(inset 0px 0px 10px 0px rgba(0, 0, 0, 0.2)); .box-sizing(border-box); float:left; .border-radius(4px); padding: 8px 10px 7px 10px; font-size:12px; line-height:15px; font-family:Arial; border:1px #ccc solid; width:300px; height:33px; background: #fff; color: #000; } #search a { display:inline-block; .box-shadow(0px 0px 5px 0px rgba(0, 0, 0, 0.2)); .border-radius(4px); padding: 6px 15px; font-size:12px; font-family:Arial; border:1px #ccc solid; background: #f5f5f5; color: #000; margin-top:0px; margin-left:10px; cursor:pointer; } #search a:hover {background: #efefef;} .search-engine .attention {background: url(../img/attention.png) no-repeat scroll 12px 50% #FDF7DF; border:1px solid #E3C555; padding:12px 24px 12px 60px; font-weight:bold; margin-bottom:20px;} .search-engine .example { color: #CCCCCC; display: inline-block; font-size: 12px; font-style: italic; padding: 5px 0; } ul.square-list { list-style-position: outside; list-style-type: square; margin: 0 0 1.5em 1.5em; } ul.square-list li {list-style:square;} /*newsletter form*/ #subscribe-form { width: 300px; position:relative; } #subscribe-form fieldset {border:none; margin:0; padding:0; } #subscribe-form label { position:relative; /*!*/ display:block; min-height:43px; } #subscribe-form input, #subscribe-form textarea { outline:none; .box-shadow(inset 0px 0px 10px 0px rgba(0, 0, 0, 0.2)); .box-sizing(border-box); float:left; .border-radius(4px); padding: 8px 10px 7px 10px; font-size:12px; line-height:15px; font-family:Arial; border:1px #ccc solid; width:300px; height:33px; background: #fff; color: #000; } #subscribe-form .error { height:0; overflow:hidden; font:10px/20px Arial; .transition(height .3s linear); position:absolute; right:3px; top:0; } #subscribe-form .success { line-height:48px; position:absolute; overflow:hidden; padding: 14px 0; left:0; top:0; display: none; .box-sizing(border-box); .box-shadow(inset 0px 0px 10px 0px rgba(0, 0, 0, 0.2)); .border-radius(4px); background:#fff; border:1px #ccc solid; z-index:10; width:100%; text-align:center; } #subscribe-form .btns a { display:inline-block; .box-shadow(0px 0px 5px 0px rgba(0, 0, 0, 0.2)); .border-radius(4px); padding: 6px 15px; font-size:12px; font-family:Arial; border:1px #ccc solid; background: #f5f5f5; color: #000; margin-top:0px; } #subscribe-form .btns a:hover {background: #efefef;} #subscribe-form label.invalid .error { height: 19px; } /*underconstruction*/ .counter_pos {margin:70px auto; width:545px; border:1px solid #CCC; background:#EEE; padding:10px; border-radius:5px} .counter_pos1 {margin:20px auto; width:525px; } .cntSeparator {font-size: 50px;margin: 24px 0px;color: #000; font-family:Georgia, "Times New Roman", Times, serif;} .counter_desc{ position:relative; overflow:hidden; font-size:16px; font-weight:bold; line-height:1.2em; padding:5px 0 0 15px;} .counter_desc div{ width:104px; text-align:center; float:left;} .counter_desc .days {margin-left:10px;} .counter_desc .hours {margin-left:45px;} .counter_desc .minutes {margin-left:23px;} .counter_desc .seconds {margin-left:12px;} /***/ /*fixed-menu*/ #content .bs-docs-sidenav li dt {position:relative;} #content .bs-docs-sidenav li dt a {width:100%; display:block; text-align:left; .box-sizing(border-box); padding:10px 30px 10px 43px;} #content .bs-docs-sidenav li dt i { right: 8px; position: absolute; padding: 5px; top: 7px;} @media (max-width: 1200px) { #content{ #nav_container { width: 220px; } } h1 {font-size: 24px;} } header h1 {margin:2px 0 0 0px; white-space:nowrap;} .cols a {width:45%;} /* Bootstrap code examples -------------------------------------------------- */ /* Base class */ .bs-docs-example { position: relative; margin: 15px 0; padding: 39px 19px 14px; *padding-top: 19px; background-color: #fff; border: 1px solid #ddd; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; } /* Echo out a label for the example */ .bs-docs-example:after { content: "Example"; position: absolute; top: -1px; left: -1px; padding: 3px 7px; font-size: 12px; font-weight: bold; background-color: #f5f5f5; border: 1px solid #ddd; color: #9da0a4; -webkit-border-radius: 4px 0 4px 0; -moz-border-radius: 4px 0 4px 0; border-radius: 4px 0 4px 0; } /* Remove spacing between an example and it's code */ .bs-docs-example + .prettyprint { margin-top: -20px; padding-top: 15px; }