DISTRHO
/
Website
mirror of https://github.com/DISTRHO/Website
1
0
Fork 0
Code Releases 0 Activity
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
31 Commits
1 Branch
7.5MB
Tree: 571e6f80ad
Branches Tags
${ item.name }
Create branch ${ searchTerm }
from '571e6f80ad'
${ noResults }
Website/css-black/style.css

768 lines
21KB
Raw Blame History 

  1. /* Getting the new tags to behave */

  2. article, aside, audio, canvas, command, datalist, details, embed, figcaption, figure, footer, header, hgroup, keygen, meter, nav, output, progress, section, source, video { display:block; }

  3. mark, rp, rt, ruby, summary, time { display:inline; }

  4. 

  5. /* Global properties ======================================================== */

  6. body {

  7.         background:#F4F4F4;

  8.         font-family: 'Raleway', sans-serif;

  9.         font-weight: 200;

  10.         font-size:100%;

  11.         line-height:1.125em;

  12.         color:#BABABA;

  13.         display:flex;

  14.         flex-direction:column;

  15. }

  16. html { min-width:1000px; }

  17. html, body { height:100%;background-color:#1E1F1F; }

  18. hr { color:#191A1A4D; background-color:transparent; }

  19. 

  20. 

  21. /* Global Structure ============================================================= */

  22. .container {

  23.         margin: 0 auto;

  24.         position: relative;

  25.         width: 1000px;

  26.         font-size:.8125em;

  27. }

  28. 

  29.         /* Header */

  30.         header{

  31.                 height:72px;

  32.                 min-height:72px;

  33.                 overflow:hidden;

  34.                 background:url(../images/header-bg_black.gif) 0 0 repeat-x;

  35.         }

  36. 

  37.         /*Gallery*/

  38.         #gallery {

  39.                 height:380px;

  40.                 min-height:380px;

  41.                 overflow:hidden;

  42.                 background:url(../images/gallerry-bg_black.jpg) 0 0 repeat-x;

  43.         }

  44.         #gallery_plugins {

  45.                 height:296px;

  46.                 overflow:hidden;

  47.                 background:url(../images/gallerry-bg_black.jpg) 0 0 repeat-x;

  48.         }

  49. 		.individual_plugin_container{

  50. 				position:absolute;

  51. 				left:0;

  52. 				top:60px;

  53. 		}

  54. 		.text_download{

  55. 				/*font-family: 'Cutive Mono', sans-serif;*/

  56. 				z-index:100;

  57. 				position:absolute;

  58. 				color:#cfcdcd;

  59. 				font-size:100%;

  60. 				left:45px;

  61. 				top:215px;

  62. 		}

  63. 		.text_download a{

  64. 				color:#cfcdcd;

  65. 		}

  66. 		.text_download a:hover{

  67. 				color:#9eb2c5;

  68. 		}

  69. 		.linuxLogo{

  70. 				background:url(../images/logo_linux.png) 100% 0 no-repeat;

  71. 		}

  72. 		.windowsLogo{

  73. 				background:url(../images/windowsLogo.png) 50% 0 no-repeat;

  74. 		}

  75. 

  76.         /* Content */

  77.         .content {

  78.                 float: left;

  79.                 width: 572px;

  80.         }

  81. 

  82.         /* Sidebar */

  83.         aside{

  84.                 float: left;

  85.                 width: 302px;

  86.                 margin: 0px 52px 0 0;

  87.         }

  88.                  .homeAside{

  89.                 float: left;

  90.                 width: 302px;

  91.                 margin:0px 52px 0 0;

  92.         }

  93.         /* Footer */

  94.         footer{

  95.                 padding:18px 0 18px 0;

  96.                 border-top: 5px solid #1A1A1A;

  97.         }

  98. 

  99. 

  100. 

  101. 

  102. /* Left & Right alignment */

  103. 

  104. .fleft { float:left;font-size:100%;vertical-align:text-bottom;}

  105. .fright { float:right;}

  106. .clear { clear:both;}

  107. 

  108. .col-1, .col-2, .col-3 { float:left;}

  109. 

  110. .alignright { text-align:right;}

  111. .aligncenter { text-align:center;}

  112. 

  113. .wrapper {

  114.         width:100%;

  115.         overflow:hidden;

  116. }

  117. 

  118. /* The inside class provides consistent padding. To be used often! */

  119. .inside{ padding: 20px 37px 30px 37px; }

  120. 

  121. .imagebox{ padding:50px 0px 0px 0px;}

  122. 

  123. /*----- form defaults -----*/

  124. input, select, textarea {

  125.         font-family: 'Raleway', sans-serif;

  126.         font-size:1em;

  127.         vertical-align:middle;

  128.         font-weight:normal;

  129. }

  130. 

  131. /*----- other -----*/

  132. figure {

  133. 

  134.         margin-bottom:5px;

  135. 

  136. }

  137. 

  138. img {padding:0px;}

  139. 

  140. legend {

  141.   padding-top:0;

  142.   padding-left:6px;

  143.   float:right; }

  144. 

  145. .img-indent {

  146.         margin:0 20px 0 0;

  147.         float:left;

  148. }

  149. .img-box {

  150.         width:100%;

  151.         overflow:hidden;

  152.         padding-bottom:15px;

  153. }

  154.         .img-box figure {

  155.                 float:left;

  156.                 margin:0 20px 0 0;

  157.                 padding:0;

  158.         }

  159. 

  160. .extra-wrap {

  161.         overflow:hidden;

  162. }

  163. 

  164. p {margin-bottom:18px;}

  165. .p1 { margin-bottom:9px;}

  166. .p2 { margin-bottom:18px;}

  167. .p3 { margin-bottom:27px;}

  168. 

  169. pmain{

  170.        margin-bottom:18px;

  171.        font-size:120%;

  172. 

  173. }

  174. 

  175. /*----- txt, links, lines, titles -----*/

  176. a {

  177.         color:#5D8BAA;

  178.         outline:none;

  179. 	text-decoration:none;

  180. }

  181. a:hover{

  182.         text-decoration:none;

  183. 	color:#8a8a8a;

  184. }

  185. 

  186. h1 {

  187.         font-size:34px;

  188.         line-height:1.2em;

  189.         color:#fff;

  190.         font-weight:normal;

  191. /*        background:url(../images/logo.png) no-repeat 0 0;*/

  192.         padding:6px 0 8px 0px;

  193.         position:absolute;

  194.         left:0px;

  195.         top:6px;

  196. 

  197. }

  198.         h1 a {

  199.                 color:#fff;

  200.                 text-decoration:none;

  201.         }

  202. h2.pointer a{

  203. 		font-family: 'Raleway', sans-serif;

  204.         font-size:30px;

  205.         line-height:1.2em;

  206.         font-weight:200;

  207.         color: #5D8BAA;

  208.         margin-bottom:22px;

  209. }

  210. h2.pointer a:hover{

  211. 		color:#8a8a8a;

  212. }

  213. h2 {

  214. 		font-family: 'Raleway', sans-serif;

  215.         font-size:30px;

  216.         line-height:1.2em;

  217.         font-weight:200;

  218.         color:#F1F2F2;

  219.         margin-bottom:22px;

  220. }

  221.         h2 a {

  222.                 color:#F1F2F2;

  223.                 text-decoration:none;

  224.                 font-size:24px;

  225.         }

  226.         h2 span {

  227.                 color:#8a8a8a;

  228.         }

  229. h3 {

  230. 		font-family: 'Raleway', sans-serif;

  231. 		font-weight: 300;

  232.         font-size:120%;

  233.         margin-bottom:6px;

  234. 	    color:#E1E2E2;

  235. }

  236.         h3 a {

  237. 	        text-decoration:none;

  238. 	        color:#FFFFFF; }

  239.         h3 a:hover {

  240.                 color:#8a8a8a;

  241.         }

  242. 

  243. #loopedSlider a {

  244.         color:#ff0000;

  245.         outline:none;

  246. 	text-decoration:none;

  247. }

  248. #loopedSlider a:hover{

  249.         color:#212222;

  250.         text-decoration:none;

  251. }

  252. 

  253. /*==================boxes====================*/

  254. .main-box {

  255.         border-top:5px solid #040404;

  256.         background:#040404;

  257.         width:100%;

  258.         flex:1;

  259. }

  260. 

  261. 

  262. .contacts {

  263.         padding-bottom:20px;

  264. }

  265.         .contacts li {

  266.                 width:100%;

  267.                 overflow:hidden;

  268.         }

  269.                 .contacts li strong {

  270.                         float:left;

  271.                         width:95px;

  272.                 }

  273. 

  274. 

  275. .list1 {

  276.         margin-left:12px;

  277.         padding-bottom:18px;

  278. }

  279. .list1 li {

  280.         background:url(../images/arrow1.gif) no-repeat 0 6px;

  281.         padding:0 0 0 12px;

  282. }

  283. 

  284. 

  285. 

  286. /*===== header =====*/

  287. header nav {

  288.         float:right;

  289. }

  290.                 header nav ul li {

  291.                         float:left;

  292.                 }

  293.                         header nav ul li a {

  294. 								font-family:'Raleway', sans-serif;

  295. 								font-weight: 300;

  296.                                 font-size:22px;

  297.                                 color:#fff;

  298.                                 height:67px;

  299.                                 line-height:67px;

  300.                                 text-decoration:none;

  301.                                 width:101px;

  302.                                 text-align:center;

  303.                                 float:left;

  304.                                 background:#0B1C27;

  305.                                 background-image: gradient(top, #091720, #0B1C27); /* FF3.6 */

  306.                                 background-image: -moz-linear-gradient(top, #091720, #0B1C27); /* FF3.6 */

  307.                                 background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #091720),color-stop(1, #0B1C27)); /* Saf4+, Chrome */

  308.         filter:  progid:DXImageTransform.Microsoft.gradient(startColorStr='#091720', EndColorStr='#0B1C27'); /* IE6,IE7 */

  309.         -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#091720', EndColorStr='#0B1C27')"; /* IE8 */

  310.                 }

  311.                 header nav ul li a.current, header nav ul li a:hover {

  312.                         padding-bottom:5px;

  313.                 }

  314. 

  315.                 header nav ul li:nth-of-type(2) a {

  316.                         background:#102634;

  317.                         background-image: -moz-linear-gradient(top, #102634, #132D3E); /* FF3.6 */

  318.                         background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #102634),color-stop(1, #132D3E)); /* Saf4+, Chrome */

  319.                         filter:  progid:DXImageTransform.Microsoft.gradient(startColorStr='#102634', EndColorStr='#132D3E'); /* IE6,IE7 */

  320.                         -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#102634', EndColorStr='#132D3E')"; /* IE8 */

  321.                 }

  322. 

  323.                 header nav ul li:nth-of-type(3) a {

  324.                         background:#343233;

  325.                         background-image: -moz-linear-gradient(top, #343233, #464344); /* FF3.6 */

  326.                         background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #343233),color-stop(1, #464344)); /* Saf4+, Chrome */

  327.                         filter:  progid:DXImageTransform.Microsoft.gradient(startColorStr='#343233', EndColorStr='#464344'); /* IE6,IE7 */

  328.                         -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#343233', EndColorStr='#464344')"; /* IE8 */

  329.                 }

  330.                 header nav ul li:nth-of-type(4) a {

  331.                         background:#4F4842;

  332.                         background-image: -moz-linear-gradient(top, #4F4842, #605750); /* FF3.6 */

  333.                         background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #4F4842),color-stop(1, #605750)); /* Saf4+, Chrome */

  334.                         filter:  progid:DXImageTransform.Microsoft.gradient(startColorStr='#4F4842', EndColorStr='#605750'); /* IE6,IE7 */

  335.                         -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#4F4842', EndColorStr='#605750')"; /* IE8 */

  336.                 }

  337.                 header nav ul li:nth-of-type(5) a {

  338.                         background:#746C55;

  339.                         background-image: -moz-linear-gradient(top, #746C55, #7E755C); /* FF3.6 */

  340.                         background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #746C55),color-stop(1, #7E755C)); /* Saf4+, Chrome */

  341.                         filter:  progid:DXImageTransform.Microsoft.gradient(startColorStr='#746C55', EndColorStr='#7E755C'); /* IE6,IE7 */

  342.                         -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#746C55', EndColorStr='#7E755C')"; /* IE8 */

  343.                 }

  344.                 header nav ul li:nth-of-type(6) a {

  345.                         background:#90866A;

  346.                         background-image: -moz-linear-gradient(top, #90866A, #A89D7B); /* FF3.6 */

  347.                         background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #90866A),color-stop(1, #A89D7B)); /* Saf4+, Chrome */

  348.                         filter:  progid:DXImageTransform.Microsoft.gradient(startColorStr='#90866A', EndColorStr='#A89D7B'); /* IE6,IE7 */

  349.                         -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#90866A', EndColorStr='#A89D7B')"; /* IE8 */

  350.                 }

  351. 

  352. 

  353. 

  354. 

  355. /*===== gallery =====*/

  356. .roundabout-holder  {

  357.         width:850px;

  358.         height:496px;

  359.         margin:0 auto;

  360. }

  361. .roundabout-moveable-item {

  362.    width: 646px;

  363.    height: 416px;

  364.    cursor: pointer;

  365.          border:3px solid #ccc;

  366.          border:3px solid rgba(0, 0, 0, 0.08);

  367.    border-radius:4px;

  368.          -moz-border-radius:4px;

  369.          -webkit-border-radius:4px;

  370. }

  371.         .roundabout-moveable-item img{

  372.                 width:100%;

  373.         }

  374. .roundabout-in-focus {

  375.         border:3px solid rgba(0, 0, 0, 0.2);

  376. }

  377. 

  378. 

  379. /*===== content =====*/

  380. .content {

  381. 

  382. }

  383.         .content img, aside img {

  384.                 border:1px solid #3B3B3B;

  385.                 padding:2px;

  386.                 border-radius:4px;

  387.                 -moz-border-radius:4px;

  388.                 -webkit-border-radius:4px;

  389.         }

  390.         .content img:hover {

  391.                 border-color:#bbb;

  392.         }

  393. 

  394. 

  395. /*--- news list styles ---*/

  396.         .news li {

  397.                 overflow:hidden;

  398.                 position:relative;

  399.                 padding:0 0 10px 84px;

  400.         }

  401.         .news li:last-child {

  402.                 padding-bottom:0;

  403.         }

  404. 

  405.                 .news li figure {

  406. 						font-family: 'Raleway', sans-serif;

  407. 						font-weight: 300;

  408.                         width:65px;

  409.                         height:65px;

  410.                         background:url(../images/date-none.gif) no-repeat 0 0;

  411.                         position:absolute;

  412.                         left:0;

  413.                         top:0;

  414.                         text-align:center;

  415.                         color:#818181;

  416.                         text-transform:uppercase;

  417.                 }

  418.                         .news li figure strong {

  419.                                 display:inline;

  420.                                 font-size:17px;

  421.                                 line-height:2.0em;

  422.                                 margin-bottom:-7px;

  423.                                 padding-top:4px;

  424.                         }

  425.                         .news li figure p {

  426.                                 display:inline;

  427.                                 font-size:17px;

  428.                                 line-height:0.1em;

  429. 								color:#f9f9f9;

  430. 								float:right;

  431. 								margin-right:3px;

  432.                         }

  433. 

  434. .team-list li {

  435.         width:100%;

  436.         overflow:hidden;

  437.         padding-bottom:43px;

  438. }

  439. .team-list li:last-child {

  440.         padding-bottom:0;

  441. }

  442.         .team-list li figure {

  443.                 float:left;

  444.                 margin:0 20px 0 0;

  445.                 padding:0;

  446.         }

  447. 

  448. 

  449. /*--- loopedSlider styles ---*/

  450. /*

  451.  * Required

  452. */

  453. #loopedSlider .wrap { width:295px; height:295px; overflow:hidden; position:relative;}

  454. #loopedSlider .slides { position:absolute; top:0; left:0; }

  455. #loopedSlider .slides div { position:absolute; top:0; width:295px; display:none; }

  456. /*

  457.  * Optional

  458. */

  459. #loopedSlider { width:295px; position:relative; clear:both; }

  460. #loopedSlider .nav-controls {

  461.         width:100%;

  462.         overflow:hidden;

  463.         padding-top:10px;

  464. }

  465. #loopedSlider li {

  466.         display:inline;

  467. }

  468. #loopedSlider li a.previous {

  469.         float:left;

  470. }

  471. #loopedSlider li a.next {

  472.         float:right;

  473. }

  474. 

  475. /*--- images styles ---*/

  476. 

  477. 

  478. /*#imagens { width:295px; height:170px; overflow:hidden; position:relative;}*/

  479. 

  480. 

  481. /*===== footer =====*/

  482. footer {

  483.         color:#fff;

  484. 	background-color:#1E1F1F;

  485. }

  486.         footer .fleft {

  487.                 padding-left:40px;

  488.         }

  489.         footer .fright {

  490.                 padding-right:0px;

  491.         }

  492. footer a{color:#A3B6B6;}

  493. 

  494. footer a:hover{color:#ffffff;}

  495. 

  496. /*----- forms -----*/

  497. #contacts-form {

  498.         clear:right;

  499.         width:100%;

  500.         overflow:hidden;

  501. }

  502.         #contacts-form fieldset {

  503.                 border:none;

  504.                 float:left;

  505.         }

  506.                 #contacts-form .field {

  507.                         clear:both;

  508.                 }

  509.                         #contacts-form label {

  510.                                 float:left;

  511.                                 width:110px;

  512.                                 line-height:18px;

  513.                                 padding-bottom:6px;

  514.                                 font-weight:bold;

  515.                         }

  516.                         #contacts-form input {

  517.                                 width:205px;

  518.                                 padding:1px 0 1px 3px;

  519.                                 background:none;

  520.                                 border:1px solid #e5e5e5;

  521.                                 color:#616161;

  522.                                 float:left

  523.                         }

  524.                         #contacts-form input:invalid {

  525.                                 border-color:red;

  526.                         }

  527.                         #contacts-form textarea {

  528.                                 width:450px;

  529.                                 height:215px;

  530.                                 padding:1px 0 1px 3px;

  531.                                 background:none;

  532.                                 border:1px solid #e5e5e5;

  533.                                 color:#616161;

  534.                                 margin-bottom:12px;

  535.                                 overflow:auto;

  536.                                 float:left;

  537.                         }

  538.                         #contacts-form div:last-child {

  539.                                 padding-left:110px;

  540.                         }

  541. 

  542. /*==================lightbox========================*/

  543. 

  544. #lightbox{	position: absolute;	left: 0; width: 100%; z-index: 100; text-align: center; line-height: 0;}

  545. #lightbox img{ width: auto; height: auto;}

  546. #lightbox a img{ border: none; }

  547. 

  548. #outerImageContainer{ position: relative; background-color: #fff; width: 250px; height: 250px; margin: 0 auto; }

  549. #imageContainer{ padding: 10px; }

  550. 

  551. #loading{ position: absolute; top: 40%; left: 0%; height: 25%; width: 100%; text-align: center; line-height: 0; }

  552. #hoverNav{ position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10; }

  553. #imageContainer>#hoverNav{ left: 0;}

  554. #hoverNav a{ outline: none;}

  555. 

  556. #prevLink, #nextLink{ width: 49%; height: 100%; background-image: url(../images/nolabel.gif); /* Trick IE into showing hover */ display: block; }

  557. #prevLink { left: 0; float: left;}

  558. #nextLink { right: 0; float: right;}

  559. #prevLink:hover, #prevLink:visited:hover { background: url(../images/prevlabel.gif) left 15% no-repeat; }

  560. #nextLink:hover, #nextLink:visited:hover { background: url(../images/nextlabel.gif) right 15% no-repeat; }

  561. 

  562. #imageDataContainer{ font: 10px Verdana, Helvetica, sans-serif; background-color: #fff; margin: 0 auto; line-height: 1.4em; overflow: auto; width: 100%	; }

  563. 

  564. #imageData{	padding:0 10px; color: #666; }

  565. #imageData #imageDetails{ width: 70%; float: left; text-align: left; }

  566. #imageData #caption{ font-weight: bold;	}

  567. #imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;	}

  568. #imageData #bottomNavClose{ width: 66px; float: right;  padding-bottom: 0.7em; outline: none;}

  569. 

  570. #overlay{ position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px; background-color: #000; }

  571. a.hidden{ display:none;}

  572. 

  573. /*==================menuslider========================*/

  574. 

  575. .button {

  576. position:absolute;

  577. }

  578. .button img {

  579. margin-bottom:10px;

  580. }

  581. 

  582. .menu_button {

  583. height: 16px;

  584. width: 92px;

  585. margin: auto;

  586. }

  587. 

  588. .menu_class {

  589. }

  590. .the_menu {

  591. display:none;

  592. width:300px;

  593. }

  594. .the_menu li {

  595. background-color: #040404;

  596. }

  597. .the_menu li a {

  598. font-family:'Raleway', sans-serif;

  599. font-weight: 200;

  600. color:#5D9BAA;

  601. text-decoration:none;

  602. padding:0px 10px 0px 5px;

  603. display:block;

  604. font-size:100%;

  605. }

  606. .the_menu li a:hover {

  607. padding:0px 10px 0px 5px;

  608. color: #8a8a8a;

  609. }

  610. .formleftside{

  611. position:relative;

  612. left:10px;

  613. bottom:5px;

  614. }

  615. .rslides {

  616.   position: relative;

  617.   list-style: none;

  618.   overflow: hidden;

  619.   width: 100%;

  620.   padding: 0;

  621.   margin: 0;

  622.   }

  623. 

  624. .rslides li {

  625.   -webkit-backface-visibility: hidden;

  626.   position: absolute;

  627.   display: none;

  628.   width: 100%;

  629.   left: 0;

  630.   top: 0;

  631.   }

  632. 

  633. .rslides li:first-child {

  634.   position: relative;

  635.   display: block;

  636.   float: left;

  637.   }

  638. 

  639. .rslides img {

  640.   display: block;

  641.   height: auto;

  642.   float: left;

  643.   width: 100%;

  644.   border: 0;

  645.   }

  646. 

  647.   .centered-btns_nav {

  648.   z-index: 10;

  649.   position: absolute;

  650.   -webkit-tap-highlight-color: rgba(0,0,0,0);

  651.   top: 50%;

  652.   left: 0;

  653.   opacity: 0.7;

  654.   text-indent: -9999px;

  655.   overflow: hidden;

  656.   text-decoration: none;

  657.   height: 61px;

  658.   width: 38px;

  659.   background: transparent url(../images/themes.gif) no-repeat left top;

  660.   margin-top: -45px;

  661.   }

  662. 

  663. .centered-btns_nav:active {

  664.   opacity: 1.0;

  665.   }

  666. 

  667. .centered-btns_nav.next {

  668.   left: auto;

  669.   background-position: right top;

  670.   right: 0;

  671.   }

  672. 

  673. .transparent-btns_nav {

  674.   z-index: 3;

  675.   position: absolute;

  676.   -webkit-tap-highlight-color: rgba(0,0,0,0);

  677.   top: 0;

  678.   left: 0;

  679.   display: block;

  680.   background: #fff; /* Fix for IE6-9 */

  681.   opacity: 0;

  682.   filter: alpha(opacity=1);

  683.   width: 48%;

  684.   text-indent: -9999px;

  685.   overflow: hidden;

  686.   height: 91%;

  687.   }

  688. 

  689. .transparent-btns_nav.next {

  690.   left: auto;

  691.   right: 0;

  692.   }

  693. 

  694. .large-btns_nav {

  695.   z-index: 10;

  696.   position: absolute;

  697.   -webkit-tap-highlight-color: rgba(0,0,0,0);

  698.   opacity: 0.6;

  699.   text-indent: -9999px;

  700.   overflow: hidden;

  701.   top: 0;

  702.   bottom: 0;

  703.   left: 0;

  704.   background: #000 url(../images/themes.gif) no-repeat left 50%;

  705.   width: 38px;

  706.   }

  707. 

  708. .large-btns_nav:active {

  709.   opacity: 1.0;

  710.   }

  711. 

  712. .large-btns_nav.next {

  713.   left: auto;

  714.   background-position: right 50%;

  715.   right: 0;

  716.   }

  717. 

  718. .centered-btns_nav:focus,

  719. .transparent-btns_nav:focus,

  720. .large-btns_nav:focus {

  721.   outline: none;

  722.   }

  723. 

  724. .centered-btns_tabs,

  725. .transparent-btns_tabs,

  726. .large-btns_tabs {

  727.   margin-top: 10px;

  728.   text-align: right;

  729.   }

  730. 

  731. .centered-btns_tabs li,

  732. .transparent-btns_tabs li,

  733. .large-btns_tabs li {

  734.   display: inline;

  735.   float: none;

  736.   _float: left;

  737.   *float: left;

  738.   margin-right: 5px;

  739.   }

  740. 

  741. .centered-btns_tabs a,

  742. .transparent-btns_tabs a,

  743. .large-btns_tabs a {

  744.   text-indent: -9999px;

  745.   overflow: hidden;

  746.   -webkit-border-radius: 15px;

  747.   -moz-border-radius: 15px;

  748.   border-radius: 15px;

  749.   background: #ccc;

  750.   background: rgba(0,0,0, .2);

  751.   display: inline-block;

  752.   _display: block;

  753.   *display: block;

  754.   -webkit-box-shadow: inset 0 0 2px 0 rgba(0,0,0,.3);

  755.   -moz-box-shadow: inset 0 0 2px 0 rgba(0,0,0,.3);

  756.   box-shadow: inset 0 0 2px 0 rgba(0,0,0,.3);

  757.   width: 6px;

  758.   height: 6px;

  759.   }

  760. 

  761. .centered-btns_here a,

  762. .transparent-btns_here a,

  763. .large-btns_here a {

  764.   background: #222;

  765.   background: rgba(0,0,0, .8);

  766.   }

  767.