Advertisement
rhandom

Tabs CSS

Aug 11th, 2015
421
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. @charset "utf-8";
  2. /*
  3. Theme Name: DeCondo Child
  4. Description: Child theme for the DeCondo theme
  5. Author: Jasper Frumau
  6. Template: decondo
  7. */
  8.  
  9.  
  10. @import url("../decondo/style.css");
  11. @import url("../decondo/lib/scripts/superfish/superfish.css");
  12.  
  13.  
  14.  
  15. /*  ##################################
  16.     HEADERS
  17.     ################################## */
  18.  
  19. h3, h4, h5, h6{
  20.     font-size:18px;
  21.     text-transform:uppercase;
  22. }
  23.  
  24. .page-fiji-facts #content h3,
  25. .page-fiji-facts #content h4,
  26.  .page-fiji-facts #content h5,
  27.  .page-fiji-facts #content h6 {
  28.     background: url('images/fiji-facts-bullet.jpg') no-repeat bottom left;
  29.     padding:0 0 0 25px;
  30.     color:#2d6dbf;
  31. }
  32.  
  33. .sidepostbox h3 {
  34.     font-size:1.17em;
  35. }
  36. /*  ##################################
  37.     DESTINATIONS TOP TEXT BOX
  38.     ################################## */
  39.  
  40. #toplinksdestinations .textwidget {
  41.     color:#424242;
  42. }
  43.  
  44. #toplinksdestinations h3 {
  45.     text-transform:uppercase;
  46.     font-size:20px;
  47. }
  48.  
  49. /*  ##################################
  50.     HEADER ADDITIONS
  51.     ################################## */
  52.  
  53.  
  54. #top-margin{
  55.     height:10px;
  56.     position:relative;
  57.     z-index:10;
  58.     margin:0;
  59.     background:#fff;
  60. }
  61.  
  62. .ts-menu {
  63.     position:absolute;
  64.     left:0;
  65.     width:860px;
  66.     margin:0 0 0 200px;
  67.     top:0px;
  68.     z-index:10;
  69. }
  70.  
  71.  
  72. .sf-menu li {
  73.     float:left;
  74.     position:relative;
  75.     top:5px;
  76.     width:auto;
  77. }
  78.  
  79. /*  ##################################
  80.     FOOTER ADDITIONS
  81.     ################################## */
  82.  
  83. .footer-menu .sf-menu li {
  84.     top:0px;
  85. }
  86.  
  87. #menu-footer {
  88.     margin: 0 auto;
  89.     width:720px;
  90. }
  91.  
  92. #footercopyright a {
  93.     color:#f6ea6a;
  94. }
  95.  
  96. /*  ##################################
  97.     SUPERFISH ADJUSTMENTS
  98.     ################################## */
  99.  
  100. #header .ts-menu .sf-menu li:hover ul,
  101. #header .ts-menu .sf-menu li.sfHover ul {
  102.     left:           20px;
  103.     top:            38px; /* 50 BEFORE match top ul list item height */
  104.     z-index:        100;
  105.    
  106. }
  107.  
  108.  
  109.  
  110.  
  111. #header .ts-top .sf-menu li:hover ul,
  112. #header .ts-top .sf-menu li.sfHover ul {
  113.     left:           0px;
  114.     top:            38px; /* match top ul list item height */
  115.     z-index:        100;
  116. }
  117.  
  118. .sf-sub-indicator {
  119.     display:none;
  120. }
  121.  
  122. #header .ts-menu .sf-menu li li a, #header .ts-menu .sf-menu li li a:visited {
  123. background:url('images/menu/drop-down-bg.jpg') repeat-x scroll 0 0 transparent;
  124. }
  125.  
  126. /*  ##################################
  127.     END SUPERFISH ADJUSTMENTS
  128.     ################################## */
  129.  
  130.  
  131. #header {
  132.     padding:50px 0 50px;
  133.     position:relative;
  134.     z-index:10;
  135. }
  136.    
  137. #logo{
  138.     border:none;
  139. }
  140. #header h1 {
  141.     /*border-left:1px solid #FFFFFF; */
  142.     color:#C5C5C5;
  143.     float:right;
  144.     font-size:13px;
  145.     font-style:italic;
  146.     font-weight:normal;
  147.     line-height:50px;
  148.     margin:0;
  149.     padding:0 0 0 0px;
  150.     text-shadow:1px 1px 0 #FFFFFF;
  151.     background:url('images/title-block.jpg');
  152.     background-repeat:no-repeat;
  153.     width:785px;
  154.     height:50px;
  155.     text-indent:-3000px;
  156.     white-space:nowrap;
  157. }
  158.  
  159. .sidepostcontent p {
  160.     margin:0 10px 5px 0px;
  161. }
  162.  
  163.  
  164.  
  165. /*  ##################################
  166.     SLOGAN
  167.     ################################## */
  168.  
  169. #slogan-bar {
  170.     margin:0px;
  171.     position:absolute;
  172.     left:0px;
  173.     top:110px;
  174.     z-index:5;
  175.     width:100%;
  176.     height:27px;
  177.     background:url('images/slogan-bar.jpg');
  178.     background-repeat:repeat-x;
  179. }
  180.  
  181. #header h2 {
  182.     background:url('images/site-slogan-24.png');
  183.     background-repeat:no-repeat;
  184.     color:#C5C5C5;
  185.     float:right;
  186.     font-size:13px;
  187.     font-style:italic;
  188.     font-weight:normal;
  189.     line-height:27px;
  190.     margin:10px 180px 0 0px;
  191.     padding:0 0 0 0px;
  192.     text-shadow:1px 1px 0 #FFFFFF;
  193.     width:600px;
  194.     height:25px;
  195.     text-indent:-9999px;
  196. }
  197.  
  198. #h2-page {
  199.     background:none;
  200.     color:#424242;
  201.     text-transform:uppercase;
  202.     font-size:20px;
  203. }
  204.  
  205. .h2-section {
  206. background:none;
  207. }
  208.  
  209. #header h2 span{
  210.     display:none;
  211. }
  212.  
  213.  
  214.  
  215.  
  216. /*  ##################################
  217.     SUBNAV
  218.     ################################## */
  219.  
  220. #subnav {
  221. /*padding:50px 0 50px;*/
  222. /*  z-index:5;*/
  223.     color:#00F;
  224.     font-size:13px;
  225.     width:830px;
  226.     position:relative;
  227.     left:210px;
  228. /*  top:120px;
  229. */
  230. }
  231.  
  232. #dummyblock
  233. {
  234.  
  235. height:20px;
  236. width:100%;
  237. }
  238. #phone-button, #email-button, #book-button, #ultimate-shark-button {
  239.     float:left;
  240.     text-transform:uppercase;
  241.     margin:0 10px 0 0;
  242.     font-size:12px;
  243.     color: #1a68b2;
  244.    
  245. }
  246.  
  247. #phone-button {
  248.     width:240px;
  249. }
  250.  
  251. #email-button {
  252.     width:180px;
  253. }
  254.  
  255. #book-button {
  256.     width:80px;
  257. }
  258.  
  259. #ultimate-shark-button {
  260.     width:245px;
  261. }
  262.  
  263. .sub-button{
  264.     float:left;
  265.     margin: 0 0 5px 5px;
  266. }
  267.  
  268. .sub-button a {
  269.     text-decoration:none;
  270.     color:#1A68B2;
  271. }
  272.  
  273. #phone-button img, #email-button img, #book-button img, #ultimate-shark-button img {
  274.     float:left;
  275. }
  276. /*  ##################################
  277.     MAIN NEW
  278.     ################################## */
  279.  
  280. #main {
  281.     margin:0 auto;
  282.     width:1000px;
  283. }
  284.  
  285. .category-specials #main {
  286.     min-height: 750px;
  287. }
  288.  
  289. /*  ##################################
  290.     CONTENT / SIDEBAR
  291.     ################################## */
  292.  
  293. #content {
  294.         display: block;
  295.         float: right;
  296.         width: 640px;
  297.         z-index: 1;
  298.         min-height: 550px; /*was 700 */
  299.     }
  300. #sidebar {
  301.     float: left;
  302.     width: 300px;
  303.     padding: 0 0 20px;
  304. }
  305.  
  306. /*  ##################################
  307.     CONTENT` / SIDEBAR BOTTON LEFT
  308.     ################################## */
  309.  
  310.  
  311. #sidebar-bottom {
  312.     float: left;
  313.     width: 300px;
  314.     padding: 0 0 0px; /*bottom 20 */
  315. }
  316.  
  317. #sidebar-bottom ul {
  318.     margin-bottom:0;
  319. }
  320.  
  321. #sidebar-bottom h2 {
  322. font-size:16px;
  323. letter-spacing:0.5px;
  324. margin:0 0 20px;
  325. padding:5px 0 0;
  326. }
  327.  
  328. #sidebar-bottom h2 {
  329. font-size:16px;
  330. letter-spacing:0.5px;
  331. margin:0 0 20px;
  332. padding:5px 0 0;
  333. }
  334.  
  335. #sidebar-bottom h2 {
  336.     margin: 0 0 0px 0;
  337.     padding: 5px 0 0 0;
  338.     font-size: 16px;
  339.     letter-spacing: .5px;
  340. }
  341.  
  342. #sidebar-bottom h3 {
  343.     text-transform:uppercase;
  344.     line-height:15px;
  345.     margin:0;
  346. }
  347.  
  348. #sidebar-bottom p {
  349.     line-height:15px;
  350. }
  351.  
  352. #sidebar-bottom  .box2 {
  353.     margin: 0;
  354. }
  355.  
  356. .slidedeck_frame {
  357.     margin: 10px 0 0 0;
  358. }
  359.  
  360.  
  361. /*  ##################################
  362.     DECONDO FOOTER MENU
  363.     ################################## */
  364.  
  365. .footer-menu .sf-menu a, .ts-menu .sf-menu a:visited  {
  366.     font-size:12px;
  367.     /*letter-spacing: .5px;*/
  368.        
  369. }
  370.  
  371. #footer a {
  372.     display: block;
  373.     float: left;
  374.     margin: 0 0 0 20px;
  375.     line-height: 50px;
  376.     color: #fff;
  377.     text-decoration: none;
  378.     text-transform: uppercase;
  379.     text-shadow: 1px 1px 1px #000;
  380.     letter-spacing: .5px;
  381.     outline: none;
  382. }
  383.  
  384. .ts-menu .sf-menu a:hover,
  385. .footer-menu .sf-menu a:hover {
  386.     color: #69c5ff!important;
  387. }
  388.  
  389. .footer-menu .sf-menu li li a,
  390. .footer-menu .sf-menu li li a:visited {
  391.     margin: 0px!important;
  392.     padding: 2px 10px;
  393.     line-height: 20px;
  394.     background: #555;
  395.     color: #c5c5c5;
  396.     border-bottom: 1px dotted #8a8a8a;
  397.     font-weight: normal;
  398.     text-transform: none;
  399. }
  400.  
  401. .footer-menu .sf-menu li li a:hover {
  402.     background: #252525;
  403.     color: #fff;
  404. }
  405.  
  406. #footercopyright
  407. {
  408.         height:100px;  
  409.         background:#1b51ba;
  410.         color: #dbff33;
  411. }
  412.  
  413. #footer-center {
  414.     margin:0 auto;
  415.     width:300px;
  416.     text-align:center;
  417. }
  418.  
  419.  
  420. #footer {
  421.     background:url("images/menu/menu-bar-bg.jpg") repeat-x;
  422.     width:100%;
  423. }
  424.  
  425. /* Feature content start */
  426.  
  427. #featured {  
  428.     width:500px;  
  429.     padding:15px 0 0 5px; /* 180 left */  
  430.     margin: 0px 0 0 5px ;
  431.     position:relative;  
  432.     height:00px;  
  433.     background:#fff;  
  434. /*    border:3px solid #ccc;
  435. */     
  436.     }  
  437.  
  438.  
  439. /*  ##################################
  440.       DECONDO TABBED SLIDER BOX
  441. ################################## */
  442.  
  443. #featured ul.ui-tabs-nav {  
  444.     position:absolute;  
  445.     top:15px;
  446.     left:15px;
  447.     z-index:5;  
  448.     list-style:none;  
  449.     padding:0; margin:0;  
  450.     width:180px;  
  451. }
  452.  
  453. #featured ul.ui-tabs-nav li {  
  454.      padding:1px 0; padding-right:23px;  
  455.      font-size:12px;  
  456.      color:#666;  
  457. }
  458.  
  459. #featured ul.ui-tabs-nav li span {  
  460.     font-size:12px;
  461.     font-family:Georgia;  
  462.     line-height:18px;
  463.     color:#f6ea6a;
  464.     font-weight:bolder;
  465.     text-transform:uppercase;
  466. }  
  467.  
  468.  
  469. #featured .ui-tabs-panel{ /* main image panel*/  
  470.     width:600px;
  471.     height:500px;
  472.     margin:0px 0 0 8px;  
  473.   background:#fff;
  474.     position:relative;
  475.     z-index:2;  
  476.     overflow:hidden;  
  477. }
  478.  
  479. #featured .ui-tabs-hide {  
  480.     display:none;  
  481. }  
  482.  
  483. #featured li.ui-tabs-nav-item a { /*On Hover Style*/  
  484.   display:block;  
  485.   height:45px;  
  486.   color:#f6ea6a;
  487.     font-size:8px;
  488.     text-decoration:none;
  489.     text-transform:uppercase;
  490.     background: #434d4d;
  491.     filter:alpha(opacity=50);
  492.     -moz-opacity:0.5;
  493.     -khtml-opacity: 0.5;
  494.     opacity: 0.5;
  495.   line-height:20px;  
  496.   outline:none;  
  497.  }
  498.  
  499. #featured li.ui-tabs-nav-item a:hover {  
  500.     background:#404040;  
  501. }
  502.  
  503. #featured li.ui-tabs-selected{ /*Selected tab style*/  
  504.     background:url('images/slider-arrow.png') top left no-repeat transparent;
  505.     height:45px;
  506.     /*background:#404040; solution for arrow ending needed*/
  507. }  
  508.  
  509. #featured li.ui-tabs-selected a {
  510.     display:block;  
  511.     height:45px;  
  512.     color:#333;
  513.     background:none;
  514.    
  515. }
  516.  
  517. #featured li.ui-tabs-selected ui-state-active a {
  518.     display:block;  
  519.      height:45px;  
  520.      color:#333;
  521.     background:#404040;
  522.    
  523. }
  524.  
  525. #featured li.ui-tabs-selected ui-state-hover a {
  526.     display:block;  
  527.     height:45px;  
  528.     color:#333;
  529.     background:#404040;
  530. }
  531.  
  532.  
  533. #featured ul.ui-tabs-nav li img{  
  534.       float:left; margin:2px 5px;  
  535.       background:#fff;  
  536.       padding:2px;  
  537.       border:1px solid #eee;  
  538. }
  539.  
  540. #featured .ui-tabs-panel .info{  
  541.     position:absolute;  
  542.     bottom:0px;
  543.     left:0;  
  544.     height:70px;
  545.     width: 600px;  
  546.     background: url('images/main-slide-desc-bg.jpg');
  547.     background-repeat:repeat-x;
  548.    
  549. }
  550.  
  551. #featured .info h2{  
  552.       font-size:18px; font-family:Georgia, serif;  
  553.       color:#fff; padding:5px; margin:0;  
  554.       overflow:hidden;  
  555. }  
  556.  
  557. #featured .info p{  
  558.     margin:0 5px;  
  559.     font-family:Verdana;
  560.     font-size:11px;
  561.     color:#69c5ff;
  562.     line-height:15px;  
  563. }  
  564.  
  565. #featured .info a {  
  566.     text-decoration:none;  
  567.     color:#f6ea6a;
  568.     font-family: "Myriad Pro";
  569.     text-transform:uppercase;
  570.     font-size:12px;
  571.   }  
  572. #featured .info a:hover {  
  573.     text-decoration:underline;
  574.     color:#f6ea6a;  
  575. }  
  576.  
  577. .slide-readmore {
  578.     width:95px;
  579.     height:25px;
  580.     float:right;
  581.     margin:0 20px 0 0;
  582. }
  583.  
  584. .slide-excerpt, #slide-excerpts {
  585.     width:450px;
  586.     float:left;
  587. }
  588.  
  589. /* Tabbed slider Background ShadowBox */
  590.  
  591. img.source-image {
  592.     position: absolute;
  593.     top: 0;
  594.     left: 0;
  595. }
  596.  
  597. #img.source-image {
  598.     width: 100%;
  599.     position: absolute;
  600.     top: 0;
  601.     left: 0;
  602. }
  603.  
  604. /* Feature content end */
  605.  
  606. /* Top links start */
  607.  
  608. #toplinks {  
  609.         width:360px;  
  610.         height:320px;  
  611.         background-repeat:no-repeat;
  612.         float:left;
  613. }
  614.  
  615. .category-specials #toplinks {
  616.     height:100%;
  617. }
  618.  
  619. #toplinksdestinations {  
  620.         width:360px;  
  621.         height:460px;  
  622.         background-repeat:no-repeat;
  623.         float:left;
  624. }
  625.  
  626. #toplinkscategory {  
  627.         width:360px;  
  628.         height:460px;  
  629.         background-repeat:no-repeat;
  630.         float:left;
  631. }
  632.  
  633. #toplinkspage {  
  634.         width:360px;  
  635.         height:320px;  
  636.         background-repeat:no-repeat;
  637.         float:left;
  638. }
  639. #toplinkscontacts {  
  640.         width:360px;  
  641.         height:570px;  
  642.         background-repeat:no-repeat;
  643.         float:left;
  644. }
  645.  
  646. #topl-specials {
  647.     width:350px;
  648.     height:130px;
  649.   background-image: url("images/shadowboxes/fiji-specials-box.jpg");
  650.   background-color: white;
  651. }
  652.  
  653. #contactdetails {
  654.     width:350px;
  655.     height:200px;
  656.     background: url('images/shadowboxes/contact-bg.jpg') no-repeat;
  657.     font-weight:bold;
  658.     font-size:15px;
  659.    
  660.     padding:0px;
  661. }
  662.  
  663. #contactdetailsheading
  664. {
  665.     color:#226AC6;
  666.     font-weight:bold;
  667.     margin-left:15px;
  668.     font-size:20px;
  669.     width:100px;
  670.     float:left;
  671.    
  672. }
  673. #adddetails
  674. {
  675. margin-bottom:5px;
  676. }
  677. #emaildetails
  678. {
  679. margin-top:5px;
  680. height:20px;
  681. }
  682. #contactdetailsheadingadd
  683. {
  684.     color:#226AC6;
  685.     font-weight:bold;
  686.     margin-left:15px;
  687.     font-size:20px;
  688.     width:100px;
  689.     float:left;
  690.     height:100px;
  691. }
  692. #contactdetailsheadingaddex
  693. {
  694.     color:#000000;
  695.     font-weight:bold;
  696.    
  697.     font-size:12px;
  698.     width:220px;
  699.     float:left;
  700.     height:100px;
  701.     margin:0px 0px 15px 30px;
  702. }
  703. #contactdetailsmail
  704. {
  705. color:#000000;
  706.     font-weight:bold;
  707.    
  708.     font-size:12px;
  709.     width:220px;
  710.     float:left;
  711.     margin:0px 0px 15px 30px;
  712. }
  713. #topl-booknow {
  714.     width:350px;
  715.     height:182px;
  716.   background: url('images/shadowboxes/book-now-box.jpg') no-repeat;
  717. }
  718.  
  719. #topl-booknow a{
  720.     width:350px;
  721.     height:182px;
  722. }
  723. #links-trans {
  724.     float:left;
  725.     width:350px;
  726. }
  727.  
  728. /*#links-trans div.textwidget, #links-trans p {
  729.     height:135px;
  730. }*/
  731.  
  732. #translation_bar {
  733.     width:150px;
  734.     height:50px;
  735.     padding:30px 0 0 35px;
  736.     margin:0 0 0 10px;
  737.     background: url('images/shadowboxes/translation-box.jpg') no-repeat;
  738. }
  739.  
  740. #fiji-map-box{  
  741.         width:175px;  
  742.         float:left;
  743.  
  744. }
  745.  
  746. #toptranslate{  
  747.         width:175px;  
  748.         float:right;
  749. }
  750.  
  751. #trans-inner{
  752.         border: 5px solid #fff;
  753.         padding:10px 0 0 10px;
  754.         height:60px;
  755.         background:#e5e5e5;
  756. }
  757.  
  758. #translation_bar a{
  759.     padding-right:5px;
  760. }
  761.    
  762. #topslider
  763. {
  764.     height:520px;
  765.     float:left;
  766.     margin:0 0 5px 0;
  767. }
  768.  
  769.  
  770. #content h2, #sidebar h2 {
  771. font-size:20px;
  772. letter-spacing:0.5px;
  773. margin:0 0 20px;
  774. padding:5px 0 0;
  775. }
  776.  
  777. #toptranslate .sidepostheading {
  778.     display:none;
  779. }
  780.  
  781.  
  782. /*  ##################################
  783.     DESTINATIONS MAPS
  784.     ################################## */
  785.  
  786. #topdestination {
  787.     width:638px;
  788.     height:575px;
  789.     margin:0 0 0 10px;
  790.     float:left;
  791. }
  792.  
  793. #topgallery {
  794.     width:638px;
  795.     height:575px;
  796.     /*background:url("images/shadowboxes/gallery-bg-box.jpg") ;*/
  797.  
  798.     margin:0 0 30px 10px;
  799.     float:left;
  800. }
  801.  
  802. #placeframe {
  803. background:url("maps/images/back_map.png") repeat-y scroll 0 0 transparent;
  804. float:left;
  805. height:446px;
  806. width:605px;
  807. }
  808.  
  809. #ullegend-top li, #ullegend-bottom li {
  810.     display: inline;
  811. }
  812.  
  813. /*  ##################################
  814.     LEGEND HEADER
  815.     ################################## */
  816.  
  817. #legend-header {
  818.     width:620px;
  819.     height:15px;
  820.     margin:0 0 0 20px;
  821.     padding:0;
  822.     font-family:Georgia;
  823.     font-weight:bold;
  824. }
  825.  
  826. /*  ##################################
  827.     DESTINATIONS LEGEND
  828.     ################################## */
  829. #destinations-legend {
  830.     width:640px;
  831.     height:95px;
  832.     background: url("images/legend-destinations.jpg") no-repeat;
  833.     margin:0;
  834.     padding:0;
  835. }
  836.  
  837. #dest-legendlist-top-box {
  838.     padding:20px 0 0 10px;
  839.     width:620px;
  840. }
  841.  
  842. #dest-legendlist-bottom-box {
  843.     padding:5px 0 0 10px;
  844.     width:620px;
  845. }
  846.  
  847. ul#dest-legendlist-top, ul#dest-legendlist-bottom {
  848.     /*display: inline; made width collapse and is not needed*/
  849.     height:30px;
  850.     margin:0;
  851.     padding:0;
  852.     width:620px;
  853. }
  854.  
  855.  
  856. #coral-coast-button, #nadi-and-denauru-button, #yasawa-button, #vanua-levu-button, #liveaboards-button  {
  857.     width:100px;
  858.     height:25px;
  859.     margin:0 0 0 11px;
  860.     padding:7px 0 5px 0;
  861.     display:inline;
  862.     cursor: pointer;
  863. }
  864.  
  865. #liveaboards-button {
  866.     cursor: default;
  867. }
  868.  
  869. #coral-coast-button a, #nadi-and-denauru-button a, #yasawa-button a, #vanua-levu-button a, #liveaboards-button a {
  870.     padding:5px 20px;
  871.     visibility:hidden;
  872. }
  873.  
  874. #sun-coast-button, #mamanuca-button, #taveuni-button, #kadavu-button, #zoom-out-button {
  875.     width:100px;
  876.     height:25px;
  877.     margin:0 0 0 15px;
  878.     padding:5px 0;
  879.     display:inline;
  880.     cursor: pointer;
  881. }
  882.  
  883. #sun-coast-button a, #mamanuca-button a, #taveuni-button a, #kadavu-button a, #zoom-out-button a {
  884.     padding:5px 20px;
  885.     visibility:hidden;
  886. }
  887.  
  888. #zoom-out-button {
  889.     margin:0 0 0 50px;
  890. }
  891. #zoom-out-button  a {
  892.     padding:5px 0 5px 20px;
  893. }
  894.  
  895. #nadi-and-denauru-button  a {
  896.     padding:5px 15px 5px 15px;
  897. }
  898.  
  899. #yasawa-button {
  900.     padding:7px 0 5px 5px;
  901.     margin:0;
  902. }
  903. /*  ##################################
  904.     VACATIONS LEGEND
  905.     ################################## */
  906.  
  907. #vacations-legend {
  908.     width:640px;
  909.     height:95px;
  910.     background: url("images/legend-vacations.jpg") no-repeat;
  911.     margin:0;
  912.     padding:0;
  913. }
  914.  
  915. #vac-legendlist-top-box {
  916.     padding:20px 0 0 10px;
  917.     width:480px;
  918.     float:left; /* added */
  919.     height:30px; /* ie7 */
  920. }
  921.  
  922. #vac-legendlist-bottom-box {
  923.     padding:0px 0 0 10px;
  924.     width:480px;
  925.     float:left; /* added */
  926. }
  927.  
  928. ul#vac-legendlist-top, ul#vac-legendlist-bottom {
  929.     /*display: inline; made width collapse and is not needed*/
  930.     height:30px;
  931.     margin:0;
  932.     padding:0;
  933.     width:480px;
  934. }
  935.  
  936.  
  937. #diving-button, #adventure-button, #spa-button, #eco-button, #liveaboard-button  {
  938.         width:100px;
  939.         height:25px;
  940.         display:inline-block;
  941.         zoom:1; /* IE 7 DIE */
  942.         *display:inline;
  943.         /*cursor: pointer;*/
  944.         border:0;
  945.     }
  946.  
  947. #diving-button {
  948.     width:120px;
  949. }
  950.  
  951. #adventure-button {
  952.         width:120px;
  953. }
  954.  
  955. #spa-button {
  956.     width:80px;
  957.     /*padding:7px 7px 7px 7px;*/
  958.     /*margin:5px 0 0 25px;*/
  959. }
  960.  
  961. #eco-button {
  962.     /*padding:7px 7px 7px 7px;*/
  963.     /*margin:5px 0 0 25px;*/
  964. }
  965.  
  966. #liveaboard-button {
  967.     padding:7px 10px 7px 10px;
  968.     /*margin:0px 0 0 50px;*/
  969. }
  970.  
  971. #liveaboard-button a {
  972.     visibility: visible;
  973.     display:block;
  974.     /*padding:15px 30px;*/
  975. }
  976.  
  977. #diving-button a, #adventure-button a, #spa-button a, #eco-button a {
  978.         padding:5px 50px;
  979.         /*visibility:hidden;*/
  980.         margin:0;
  981.         border:0;
  982.         height:20px; /*IE 7 issue*/
  983.         /*width:100px;*/
  984.         display:block
  985. }
  986.  
  987. #surfing-button, #romance-button, #luxury-button, #family-button {
  988.     width:100px;
  989.     height:25px;
  990.     display:inline-block;
  991.     zoom:1; /* IE 7 DIE */
  992.     *display:inline;
  993.     /*cursor: pointer;*/
  994. }
  995.    
  996. #surfing-button {
  997.         width:120px;
  998. }
  999.  
  1000. #romance-button {
  1001.         width:125px;
  1002. }
  1003.  
  1004. #luxury-button {
  1005.         width:80px;
  1006. }
  1007. #family-button {
  1008.         width:80px;
  1009. }
  1010.  
  1011. #surfing-button a, #romance-button a, #luxury-button a, #family-button a {
  1012.     padding:5px 50px;
  1013.     height:20px; /*IE 7 issue*/
  1014.     /*width:100px;*/
  1015.     display:block;
  1016.     /*visibility:hidden;*/
  1017. }
  1018.  
  1019. #liveaboard-vacations-field {
  1020.     float:left;
  1021.     width:100px;
  1022.     height:25px;
  1023. }
  1024.  
  1025. #liveaboard-vacations-field a {
  1026.     padding:15px 50px;
  1027.     display:block;
  1028. }
  1029. /*  ##################################
  1030.     END VACATIONS LEGEND
  1031.     ################################## */
  1032.  
  1033.  
  1034. #singlesearch .search-text {
  1035.     width:780px;
  1036. }
  1037.  
  1038. /* Top links End */
  1039.  
  1040. /* Side Posts Front */
  1041.  
  1042. .sidepost {
  1043.     position: relative;
  1044.     padding: 0; /*top was ten */
  1045.     background: #fff;
  1046.    
  1047.  
  1048. }
  1049.  
  1050.  
  1051. .sidepostbox
  1052. {
  1053.     position: relative;
  1054.     width:280px;
  1055.     height:150px;
  1056.     display:block;
  1057.     background:url("images/shadowboxes/featured-box-bg.jpg") no-repeat scroll 0 0 transparent;
  1058. }
  1059.  
  1060. .sidepostbox h2 {
  1061.     font-size:12px;
  1062.     letter-spacing:0.5px;
  1063.     color:#306295;
  1064.     margin:0 0 0 0;
  1065.     padding:0 0 0 0;
  1066. }
  1067.  
  1068. .sidepostbox h1 {
  1069.     font-size:12px;
  1070.     letter-spacing:0.5px;
  1071.     color:#000000;
  1072.     margin:0 0 0 0;
  1073.     padding:0 0 0 0;
  1074.  
  1075. }
  1076.  
  1077. .sidepostimg {
  1078.     width:85px;
  1079.     height:75px;
  1080.     float: left;
  1081.     margin-left:10px;
  1082.     margin-top:20px;
  1083.     margin-right:5px;
  1084.    
  1085. }
  1086.  
  1087. .box2
  1088. {
  1089.     width:275px;
  1090. }
  1091.  
  1092. .box2 img {
  1093.     margin: 5px;
  1094. }
  1095.  
  1096. .sidepostcontent {
  1097.     width:150px;
  1098.     height:120px;
  1099.     float: right;
  1100.     overflow:hidden;
  1101.     margin:23px 10px 5px 5px;
  1102.  
  1103. }
  1104.  
  1105. .sidepostcontent ul {
  1106.    
  1107. }
  1108.  
  1109. /* Side Posts  End*/
  1110.  
  1111. /* Heading */
  1112. .sidepostheading
  1113. {
  1114.     color:#5a98d2;
  1115.     font-size:25px;
  1116.     margin: 0 0 20px 0;
  1117.     font-weight:bold;
  1118.     margin:20px 0 0;
  1119. }
  1120.  
  1121.  
  1122. /* Heading */
  1123.  
  1124. /* Destination Start */
  1125.  
  1126. #destinationcontent
  1127. {
  1128.     float:left;
  1129.     width:1000px;
  1130.     padding: 10px 0 0 0 ;
  1131. }
  1132.  
  1133. .destinationblock
  1134. {
  1135.     float:left;
  1136.     width:310px;
  1137.     height:200px;
  1138.     padding: 10px 10px 10px 10px ;
  1139.     background:url("images/destinationblock-bg.jpg") no-repeat scroll 0 0 transparent;
  1140. }
  1141. .destimage
  1142. {
  1143. width:310px;
  1144. height:100px;
  1145. float:left;
  1146. display:block;
  1147. }
  1148.  
  1149. .destimagelink
  1150. {
  1151.     margin:0px 0 0 0px !important;
  1152. }
  1153. .destinationdetails
  1154. {
  1155. width:310px;
  1156. height:100px;
  1157. float:left;
  1158. }
  1159. .destinationblock img {
  1160.     margin:5px 0 0 5px;
  1161. }
  1162. .destinationblock h2 {
  1163.     font-size:14px;
  1164.     text-transform:uppercase;
  1165.     line-height:15px;
  1166.     margin:15px 0 5px 0;
  1167. }
  1168. .destinationblock h3
  1169. {
  1170. font-size:12px;
  1171. letter-spacing:0.5px;
  1172. color:#306295;
  1173. margin:0 0 0 0;
  1174. padding:0 0 0 0;
  1175. /*text-transform:uppercase;*/
  1176. }
  1177.  
  1178. .destinationblock a
  1179. {
  1180. position:absolute;
  1181. bottom:0px;
  1182. }
  1183.  
  1184. .destinationgo
  1185. {
  1186.     width:40px;
  1187.     height:20px;
  1188.     position:relative;
  1189.     bottom:0;
  1190. }
  1191.  
  1192. .destinationblock a {
  1193.  
  1194.     position:relative;
  1195.     bottom:0;
  1196.     margin: 0px 0px 0px 220px;
  1197. }
  1198.  
  1199. .destdesttitle
  1200. {
  1201. font-size:12px;
  1202. letter-spacing:0.5px;
  1203. color:#306295 !important;
  1204. margin:0 0 0 0 !important;
  1205. padding:0 0 0 0;
  1206. text-decoration:none;
  1207.     font-weight:bold;
  1208. text-transform:uppercase;
  1209. }
  1210. /* Destination End */
  1211.  
  1212.  
  1213. .alignrightwithmargin {
  1214.     float:right;
  1215.     margin:0 30px 20px 20px !important;
  1216.     width:auto;
  1217. }
  1218.  
  1219. .anchor1 {
  1220.     display:block;
  1221.     color:transparent;
  1222.     width:80px;
  1223.     height:20px;
  1224.     background:url("images/gothere.png") no-repeat scroll 0 0 ;
  1225. }
  1226.  
  1227. .anchor1:hover {
  1228.     display:block;
  1229.     width:80px;
  1230.     height:20px;
  1231.     color:transparent;
  1232.     background:url("images/gothere2.png") no-repeat scroll 0 0 ;
  1233. }
  1234.  
  1235. .dummyanchor1
  1236. {
  1237. background-image: url("images/gothere2.png");
  1238. background-repeat: no-repeat;
  1239. background-position: -1000px -1000px;
  1240. }
  1241.  
  1242. #logo {
  1243.     float: left;
  1244.     width: auto;
  1245.     padding: 0 20px 0 0;
  1246.     position: absolute;
  1247.     top: 0px;
  1248.     left: 0px;
  1249.     z-index: 150;
  1250. }
  1251.  
  1252.  
  1253.  
  1254. /*  ##################################
  1255.     SEARCH PANEL
  1256.     ################################## */
  1257.  
  1258. #searchpanel {
  1259.     float:left;
  1260.     width:980px;
  1261.     margin: 5px 0 0 0;
  1262.     background: url("images/slim-searchbar.jpg") no-repeat;
  1263.  
  1264. }
  1265.  
  1266. #searchpanel .box1 {
  1267.     padding:0;
  1268.     height:60px;
  1269. }
  1270.  
  1271. #panel
  1272. {
  1273.     /*background: #EAEFF8;  for non-css3 browsers
  1274.     filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFF', endColorstr='#EAEFF8');  for IE
  1275.     background: -webkit-gradient(linear, left top, left bottom, from(#FFFFFF), to(#EAEFF8));  for webkit browsers
  1276.     background: -moz-linear-gradient(top,  #FFFFFF,  #EAEFF8); for firefox 3.6+ */
  1277.     margin:0;
  1278.     height:40px;
  1279. }
  1280.  
  1281. #panel #keyword-search {
  1282.     left: 20px;
  1283.     position: absolute;
  1284.     top: 11px;
  1285. }
  1286.  
  1287. #panel ul {
  1288.     margin: 0;
  1289.     position: absolute;
  1290.     right: 220px;
  1291.     top: 11px;
  1292. }
  1293.  
  1294.  
  1295. #panel button
  1296. {
  1297.     background: #3A70BD;
  1298.     height:27px;
  1299. }
  1300.  
  1301. #panel .text, #panel .select {
  1302.     padding:5px;
  1303. }
  1304.  
  1305. #panel .select {
  1306.     height:27px;
  1307. }
  1308.  
  1309. /*  ##################################
  1310.     SEARCH PANEL HOME
  1311.     ################################## */
  1312.  
  1313. .home #searchpanel {
  1314.     width:350px;
  1315.     background:none;
  1316. }
  1317.  
  1318. .home #searchpanel .box1 {
  1319.     height:100px;
  1320.     padding:0;
  1321. }
  1322.  
  1323. .home #panel {
  1324.     /*background: #EAEFF8;  for non-css3 browsers
  1325.     filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFF', endColorstr='#EAEFF8');  for IE
  1326.     background: -webkit-gradient(linear, left top, left bottom, from(#FFFFFF), to(#EAEFF8));  for webkit browsers
  1327.     background: -moz-linear-gradient(top,  #FFFFFF,  #EAEFF8); for firefox 3.6+*/
  1328.     margin:10px 0 10px 0;
  1329.     height:40px;
  1330. }
  1331.  
  1332. .home #panel #keyword-search {
  1333.     width:300px;
  1334.     position: static;
  1335.     padding:0 0 3px 0;
  1336. }
  1337.  
  1338. .home #panel #search-text {
  1339.     width:300px;
  1340. }
  1341.  
  1342. .home #panel li {
  1343.     margin:0;
  1344. }
  1345.  
  1346. .home #panel ul {
  1347.     position: static;
  1348. }
  1349.  
  1350. /*  ##################################
  1351.     MENU EXTRAS
  1352.     ################################## */
  1353.  
  1354. .current_page_item a, li.current-category-ancestor a { color: #69c5ff!important; }
  1355. .current_page_item a:visited, li.current-category-ancestor a:visited {  color: #69c5ff!important; }
  1356. .current-cat a { color: #69c5ff!important;}
  1357. .current-cat a:visited{ color: #69c5ff!important;}
  1358.  
  1359. .black #footer-wrap {
  1360.    
  1361. }
  1362.  
  1363.  
  1364. #black-bar {
  1365.     margin:0px;
  1366.     position:absolute;
  1367.     left:0px;
  1368.     top:0px;
  1369.     z-index:5;
  1370.     width:100%;
  1371.     height:50px; /* image 55px */
  1372.     /*background: #000; /* for non-css3 browsers */
  1373.  
  1374.     /*  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#999999', endColorstr='#000000');  for IE */
  1375.     /*  background: -webkit-gradient(linear, left top, left bottom, from(#999), to(#000)); /* for webkit browsers */
  1376.     /*  background: -moz-linear-gradient(top,  #999,  #000); /* for firefox 3.6+ */
  1377.     background:url('images/menu/menu-bar-bg.jpg');
  1378.     background-repeat:repeat-x;
  1379. }
  1380.  
  1381. .gothere-button{
  1382.     margin: 0 5px 0 0;
  1383. }
  1384.  
  1385. /*  ##################################
  1386.     RESORT PAGE
  1387.     ################################## */
  1388.  
  1389.  
  1390. #resort-info {
  1391.     position:absolute;
  1392.     bottom:0;
  1393.     background:url("images/main-slide-desc-bg.jpg") repeat-x;
  1394.     left:0;
  1395.     width:100%;
  1396.     height:50px;
  1397. }
  1398.  
  1399.  
  1400.    
  1401.  
  1402. #pic-title {
  1403.     color:#f6ea6a;
  1404.     text-transform:uppercase;
  1405.     margin:0 5px;
  1406. }
  1407.  
  1408. #pic-caption {
  1409.     color:#69c5ff;
  1410.     margin:0 5px;
  1411. }
  1412.  
  1413. .pic {
  1414.     position:relative;
  1415.     color:#69c5ff;
  1416.    
  1417.    
  1418.     width:100%;
  1419.     height:100%;
  1420.     overflow:hidden;
  1421. }
  1422.  
  1423. #resortpic
  1424. {
  1425. display:block;
  1426.     height:450px;
  1427.     background:url("images/shadowboxes/gallery-bg-box.jpg") ;
  1428. }
  1429. #picborder
  1430. {
  1431.     margin: 0px 10px 10px 10px;
  1432.     height:420px;
  1433.     padding:15px 5px 10px 5px;
  1434. }
  1435. .ngg-gallery-list li img {
  1436.     width:110px;
  1437.     height:80px;
  1438. }
  1439.  
  1440. li.ngg-next, .ngg-next a.next, li.ngg-next a.next img {
  1441.     height:80px;
  1442.     width:15px;
  1443.     padding:0;
  1444. }
  1445.  
  1446. .ngg-gallery-list li.ngg-prev, .ngg-next a.prev, li.ngg-prev a.prev img {
  1447.     height:80px;
  1448.     width:15px;
  1449.     padding:0;
  1450. }
  1451.  
  1452. .ngg-gallery-list li.selected a
  1453. {
  1454.     background:#FFFFFF;
  1455. }
  1456. li.ngg-next a, li.ngg-prev a {
  1457.     padding:0;
  1458. }
  1459.  
  1460. #content ul, #content ol {
  1461. padding:0 0 0 20px;
  1462. }
  1463.  
  1464. .ngg-gallery-list {
  1465.     margin: 10px 0 0 0;
  1466. }
  1467.  
  1468. .ngg-galleryoverview {
  1469.  
  1470.     margin-top: 0px !important;
  1471. /*  width:97%;*/
  1472.    
  1473. }
  1474.  
  1475. #ngglist
  1476. {
  1477.     height:80px;
  1478. }
  1479.  
  1480. #nggpanel
  1481. {
  1482.     display:block;
  1483.     width:100%;
  1484.     height:30px;
  1485.     background: #EAEFF8; /* for non-css3 browsers */
  1486.     filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFF', endColorstr='#EAEFF8');
  1487.     background: -webkit-gradient(linear, left top, left bottom, from(#FFFFFF), to(#EAEFF8));
  1488.     background: -moz-linear-gradient(top,  #FFFFFF,  #EAEFF8);
  1489.     margin:15px 0 0px 0;
  1490.     text-align:center;
  1491.     color:#226EB6;
  1492. }
  1493. #nggpanel a
  1494. {
  1495.     color:#226EB6;
  1496.     text-decoration:none;
  1497. }
  1498.  
  1499. /*  ##################################
  1500.     CONTACT US PAGE
  1501.     ################################## */
  1502.  
  1503. .page-contact label{
  1504.  
  1505.         width:145px;
  1506.         margin:0px 10px 0 0;
  1507.         padding:2px 4px;
  1508.         display:-moz-inline-box; /*for mozilla*/
  1509.         display:inline-block; /*for Opera & IE*/
  1510.         text-align:left;
  1511.         vertical-align:top;
  1512.         color: #fff;
  1513.         font:0.9em Trebuchet MS,sans-serif;
  1514.         background-color: #1b68b1;
  1515.         font-size:14px;
  1516. }
  1517.  
  1518. #h2-contact {
  1519.     text-transform: uppercase;
  1520.     font-size:20px;
  1521.     color:#424242;
  1522.     background:none;
  1523. }
  1524.  
  1525. #contactform input.text, #contactform textarea {
  1526.     width:400px;
  1527. }
  1528.  
  1529. #contactform #contact_captcha {
  1530.     float:left;
  1531.     width:200px;
  1532.    
  1533. }
  1534.  
  1535. .page-contact .black submit,
  1536. .page-contact .button {
  1537.     background:#3a70be;
  1538.     margin: 0px 30px 0px 0px;
  1539. }
  1540.  
  1541. #contactform .p-submit {
  1542.     margin: 0px 0px 5px 0px;
  1543. }
  1544.  
  1545. .page-contact .button span {
  1546.     font-size:20px;
  1547.     text-transform:uppercase;
  1548.     font-style: normal;
  1549. }
  1550.  
  1551. .page-contact .box3 {
  1552.     background:url('images/contact-form-bg.jpg') repeat-x bottom left;
  1553.     border:5px solid #fff;
  1554. }
  1555.  
  1556. /*  ##################################
  1557.     BOXES
  1558.     ################################## */
  1559.    
  1560. .box1, .box2, .box3 {
  1561.     position: relative;
  1562.     background: none;
  1563.     padding: 10px 10px 0 10px;
  1564.     box-shadow: none;
  1565.     -moz-box-shadow: none;
  1566.     -webkit-box-shadow: none;
  1567.     -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=1, Direction=135, Color='#c5c5c5')";
  1568.     filter: progid:DXImageTransform.Microsoft.Shadow(Strength=1, Direction=135, Color='#c5c5c5');
  1569.  
  1570. }
  1571.  
  1572. /*  ##################################
  1573.     DYNAMIC SIDEBAR MENUS
  1574.     ################################## */
  1575.  
  1576.  
  1577. ul#menu-fiji-facts li a, ul#menu-book-online li a
  1578. {
  1579.     display:block; 
  1580.     text-decoration:none;
  1581.     color:#FFFFFF !important;
  1582.     font-weight: bold;
  1583.     width:330px;
  1584.     height:30px;
  1585.     background: #3f73b5 url(images/details-tab-not-selected.jpg) 50% 50% repeat-x;
  1586.     margin-top:3px;
  1587.     padding:5px 5px 0px 5px;
  1588. }
  1589.  
  1590. ul#menu-fiji-facts li a:hover, ul#menu-fiji-facts li.current-menu-item a,
  1591. ul#menu-book-online li a:hover, ul#menu-book-online li.current-menu-item a
  1592. {
  1593.     display:block; 
  1594.     text-decoration:none;
  1595.     color:#0E365C !important;
  1596.     font-weight: bold;
  1597.     width:330px;
  1598.     height:30px;
  1599.     background: #d9e6f1 url(images/details-tab-selected.jpg) 50% 50% repeat-x;
  1600.     padding:5px 5px 0px 5px;
  1601. }
  1602.  
  1603. ul#menu-fiji-facts li a:active, ul#menu-book-online li a:active
  1604. {
  1605.     display:block; 
  1606.     text-decoration:none;
  1607.     color:#0E365C !important;
  1608.     font-weight: bold;
  1609.     width:330px;
  1610.     height:30px;
  1611.     background: #d9e6f1 url(images/details-tab-selected.jpg) 50% 50% repeat-x;
  1612.     padding:5px 5px 0px 5px;
  1613. }
  1614.  
  1615. #bookonlinesidebar {
  1616.     margin:1px;
  1617. }
  1618.  
  1619. .bookonlinesidebarelementdisplay
  1620. {
  1621.     display:block; 
  1622.     text-decoration:none;
  1623.     color:#FFFFFF !important;
  1624.     font-weight: bold;
  1625.     width:330px;
  1626.     height:30px;
  1627.     background: #3f73b5 url(images/details-tab-not-selected.jpg) 50% 50% repeat-x;
  1628.     margin-top:3px;
  1629.     padding:5px 5px 0px 5px;
  1630. }
  1631.  
  1632. .bookonlinesidebarelementdisplay:hover
  1633. {
  1634.     display:block; 
  1635.     text-decoration:none;
  1636.     color:#0E365C !important;
  1637.     font-weight: bold;
  1638.     width:330px;
  1639.     height:30px;
  1640.     background: #d9e6f1 url(images/details-tab-selected.jpg) 50% 50% repeat-x;
  1641.     padding:5px 5px 0px 5px;
  1642. }
  1643.  
  1644. .bookonlinesidebaractive
  1645. {
  1646.     display:block; 
  1647.     text-decoration:none;
  1648.     color:#0E365C !important;
  1649.     font-weight: bold;
  1650.     width:330px;
  1651.     height:30px;
  1652.     background: #d9e6f1 url(images/details-tab-selected.jpg) 50% 50% repeat-x;
  1653.     padding:5px 5px 0px 5px;
  1654. }
  1655.  
  1656. .vvqbox {  margin: 10px 10px 10px 10px !important; }
  1657.  
  1658.  
  1659. .paypalimage
  1660. {
  1661.     width:100px !important;
  1662.     margin: 7px 10px 10px 5px !important;
  1663. }
  1664.  
  1665. .previmage
  1666. {
  1667.     top:10%;
  1668.     position: relative;
  1669.     /*margin:5px 0px 0px 0px;*/
  1670. }
  1671. #homedown
  1672. {
  1673.     float:left;
  1674. }
  1675.  
  1676. .sidebardesttitle
  1677. {
  1678.     color:#306295 !important;
  1679.     text-decoration:none;
  1680.     font-size:16px;
  1681.     font-weight:bold;
  1682.     letter-spacing:0.5px;
  1683.     margin:0 0 0;
  1684.     padding:5px 0 0;
  1685. }
  1686.  
  1687. /* Bullets for UI Tabs on Resort Pages*/
  1688.  
  1689. .demo .ui-tabs .ui-tabs-panel ul li {list-style-type: disc;}
  1690.  
  1691. #loacatethis
  1692. {
  1693.     float:left;
  1694.     height:45px;
  1695.     width:350px;
  1696. }
  1697.  
  1698. #locate-resort {
  1699.     float:left;
  1700.     margin: 0 10px 0 0;
  1701.     width:165px;
  1702.     padding:0 0 0 5px;
  1703. }
  1704.  
  1705. #backto-subdest {
  1706.     float:left;
  1707.     margin: 0 0 0 0;
  1708.     width:165px;
  1709.     padding:0 0 0 5px;
  1710. }
  1711.  
  1712. #loacatethis a
  1713. {
  1714.     text-decoration:underline;
  1715.     font-size:14px;
  1716.     font-weight:bold;
  1717. }
  1718.  
  1719. #trip-adviser-button
  1720. {
  1721.     float:left;
  1722.     width:160px;
  1723.     height:35px;
  1724. }
  1725.  
  1726. /************************************************************
  1727. * RESPONSIVE For TABLETS Portrait  1000px or less
  1728. ************************************************************/
  1729.  
  1730. @media only screen and (max-width : 1000px) {
  1731.    
  1732. /*************************************************************************
  1733. Top Header and Top Bar Fix for Slicknav Addition
  1734. *************************************************************************/
  1735.  
  1736. body.black {
  1737.     background: none;
  1738. }
  1739.   #top-header {
  1740.   display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
  1741.   display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
  1742.   display: -ms-flexbox;      /* TWEENER - IE 10 */
  1743.   display: -webkit-flex;     /* NEW - Chrome */
  1744.   display: flex
  1745.   -webkit-flex-direction:column;
  1746.   flex-direction:column;
  1747.   -webkit-flex-wrap:wrap;
  1748.   flex-wrap:wrap;
  1749. }
  1750.  
  1751.  
  1752. .slicknav_menu {
  1753.   margin-top: 7px;
  1754.   background: #222222;
  1755.   background: -moz-linear-gradient(top, #222222 0%, #383838 0%, #383838 0%, #5c5c5c 0%, #383838 100%);
  1756.   background: -webkit-gradient(left top, left bottom, color-stop(0%, #222222), color-stop(0%, #383838), color-stop(0%, #383838), color-stop(0%, #5c5c5c), color-stop(100%, #383838));
  1757.   background: -webkit-linear-gradient(top, #222222 0%, #383838 0%, #383838 0%, #5c5c5c 0%, #383838 100%);
  1758.   background: -o-linear-gradient(top, #222222 0%, #383838 0%, #383838 0%, #5c5c5c 0%, #383838 100%);
  1759.   background: -ms-linear-gradient(top, #222222 0%, #383838 0%, #383838 0%, #5c5c5c 0%, #383838 100%);
  1760.   background: linear-gradient(to bottom, #222222 0%, #383838 0%, #383838 0%, #5c5c5c 0%, #383838 100%);
  1761.   filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#222222', endColorstr='#383838', GradientType=0 );
  1762. }
  1763.  
  1764. .slicknav_btn {
  1765.     background: none;
  1766. }
  1767. .slicknav_btn {
  1768.     background: none;
  1769. }
  1770. /*************************************************************************
  1771. HIDE CERTAIN BLOCKS FOR TABLET
  1772. **************************************************************************/
  1773.  
  1774. #black-bar {
  1775.   display: none;
  1776. }
  1777. #slogan-bar {
  1778.   display:none;
  1779.   }
  1780. #logo {
  1781.     display:none;
  1782. }
  1783.  
  1784. .single #toplinks, .single #fiji-map-box, .single #toptranslate,
  1785. .single #loacatethis, .single-post #sidebar-bottom,
  1786.  .category #links-trans, .category #sidebar-bottom {
  1787.     display:none;
  1788.     }
  1789.  
  1790. .category #links-trans, .category #searchpanel {
  1791.   display: none;
  1792. }
  1793.  
  1794. /**************************************************************************
  1795. * GENERAL PAGE LIKE CONTACT AND ABOUT TABLET HIDDEN ITEMS
  1796. ***************************************************************************/
  1797.  
  1798. .page #links-trans {
  1799.   display:none;
  1800. }
  1801.  
  1802. .page #searchpanel {
  1803.   display:none;
  1804. }
  1805.  
  1806. .page-news #content {
  1807.   min-height: 0px;
  1808. }
  1809. /**************************************************************************
  1810. * RESORT PAGE OR SINGLE PAGE TABLET HIDDEN ITEMS
  1811. ***************************************************************************/
  1812.  
  1813. /*.single-post .ui-tabs .ui-tabs-nav {
  1814.   display:none;
  1815. }*/
  1816.  
  1817.  
  1818. .single #links-trans {
  1819.     float: left;
  1820.     width: 90%;
  1821.     padding-left: 15px;
  1822. }
  1823.  
  1824. /*************************************************************************
  1825. GENERAL TABLET HEADER SETTINGS
  1826. **************************************************************************/
  1827.  
  1828. #header h1 {
  1829.      float: left;
  1830.      width:100%;
  1831. }
  1832.  
  1833. #header h2 {
  1834.     margin: 10px 0 0 0;
  1835.     width:100%;
  1836. }
  1837.  
  1838. /**************************************************************************
  1839. * CONTACT PAGE TABLET
  1840. ***************************************************************************/
  1841. #contactform input.text, #contactform textarea {
  1842.     width: 300px;
  1843. }
  1844.  
  1845. .page-contact .box3 {
  1846.     background: none;
  1847.     border: 5px solid #fff;
  1848. }
  1849. /*********************************************************************************
  1850.  HOME & CATEGORY FLEX BOX MAIN CONTAINER TABLET
  1851. *******************************************************************************/
  1852.      
  1853. .home #main, .category #main, .single #main, .page #main {
  1854.     display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
  1855.     display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
  1856.     display: -ms-flexbox;      /* TWEENER - IE 10 */
  1857.     display: -webkit-flex;     /* NEW - Chrome */
  1858.     display: flex;             /* NEW, Spec - Opera 12.1, Firefox 20+ */
  1859.     -webkit-flex-direction:column;
  1860.     flex-direction:column;
  1861.     -webkit-flex-wrap:wrap;
  1862.     flex-wrap:wrap;
  1863.     padding:5px;
  1864.     width:640px;
  1865.     }
  1866.    
  1867. /* FLEX BOX HOME & CATEGORY MAIN BOX ITEMS *****************************/
  1868.    
  1869. .home #header, .category #header {
  1870.   webkit-box-ordinal-group: 1;   /* OLD - iOS 6-, Safari 3.1-6 */
  1871.   -moz-box-ordinal-group: 1;      /* OLD - Firefox 19- */
  1872.   -ms-flex-order: 1;              /* TWEENER - IE 10 */
  1873.   -webkit-order: 1;               /* NEW - Chrome */
  1874.   order: 1;                       /* NEW, Spec - Opera 12.1, Firefox 20+ */
  1875.   }
  1876.  
  1877. .home #subnav, .category #subnav {
  1878.   webkit-box-ordinal-group: 2;   /* OLD - iOS 6-, Safari 3.1-6 */
  1879.   -moz-box-ordinal-group: 2;      /* OLD - Firefox 19- */
  1880.   -ms-flex-order: 2;              /* TWEENER - IE 10 */
  1881.   -webkit-order: 2;               /* NEW - Chrome */
  1882.   order: 2;                       /* NEW, Spec - Opera 12.1, Firefox 20+ */
  1883.   padding:0;
  1884.   }
  1885. .home #dummyblock, .category #dummyblock {
  1886.   webkit-box-ordinal-group: 3;   /* OLD - iOS 6-, Safari 3.1-6 */
  1887.   -moz-box-ordinal-group: 3;      /* OLD - Firefox 19- */
  1888.   -ms-flex-order: 3;              /* TWEENER - IE 10 */
  1889.   -webkit-order: 3;               /* NEW - Chrome */
  1890.   order: 3;                       /* NEW, Spec - Opera 12.1, Firefox 20+ */
  1891. }
  1892.  
  1893. .home #topslider, .category #topslider {
  1894.   webkit-box-ordinal-group: 4;   /* OLD - iOS 6-, Safari 3.1-6 */
  1895.   -moz-box-ordinal-group: 4;      /* OLD - Firefox 19- */
  1896.   -ms-flex-order: 4;              /* TWEENER - IE 10 */
  1897.   -webkit-order: 4;               /* NEW - Chrome */
  1898.   order: 4;                       /* NEW, Spec - Opera 12.1, Firefox 20+ */
  1899.   margin: 0 auto 10px auto;
  1900.   width: 630px;
  1901.     }        
  1902.  
  1903. /**************************************************
  1904. * Links-trans  Flexbox Home + CATEGORY
  1905.   **************************************************/
  1906.  
  1907. .home  #links-trans {
  1908.   webkit-box-ordinal-group: 5;   /* OLD - iOS 6-, Safari 3.1-6 */
  1909.   -moz-box-ordinal-group: 5;      /* OLD - Firefox 19- */
  1910.   -ms-flex-order: 5;              /* TWEENER - IE 10 */
  1911.   -webkit-order: 5;               /* NEW - Chrome */
  1912.   order: 5;                       /* NEW, Spec - Opera 12.1, Firefox 20+ */
  1913.   display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
  1914.   display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
  1915.   display: -ms-flexbox;      /* TWEENER - IE 10 */
  1916.   display: -webkit-flex;     /* NEW - Chrome */
  1917.   display: flex;             /* NEW, Spec - Opera 12.1, Firefox 20+ */
  1918.   -webkit-flex-direction:column;
  1919.   flex-direction:column;
  1920.   width:100%;
  1921.  
  1922. }
  1923.  
  1924.  
  1925. .home #topl-specials, .category #topl-specials {
  1926.   webkit-box-ordinal-group: 6;   /* OLD - iOS 6-, Safari 3.1-6 */
  1927.   -moz-box-ordinal-group: 6;      /* OLD - Firefox 19- */
  1928.   -ms-flex-order: 6;              /* TWEENER - IE 10 */
  1929.   -webkit-order: 6;               /* NEW - Chrome */
  1930.   order: 6;                       /* NEW, Spec - Opera 12.1, Firefox 20+ */
  1931.   background: url('images/shadowboxes/fiji-specials-box-tablet.jpg') no-repeat;
  1932.   width:300px;
  1933.   height:120px;
  1934.   margin-right: 30px;
  1935. }
  1936. .home #toplinks, .category #toplinks {
  1937.   webkit-box-ordinal-group: 7;   /* OLD - iOS 6-, Safari 3.1-6 */
  1938.   -moz-box-ordinal-group: 7;      /* OLD - Firefox 19- */
  1939.   -ms-flex-order: 7;              /* TWEENER - IE 10 */
  1940.   -webkit-order: 7;               /* NEW - Chrome */
  1941.   order: 7;                       /* NEW, Spec - Opera 12.1, Firefox 20+ */
  1942.   display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
  1943.   display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
  1944.   display: -ms-flexbox;      /* TWEENER - IE 10 */
  1945.   display: -webkit-flex;     /* NEW - Chrome */
  1946.   display: flex;             /* NEW, Spec - Opera 12.1, Firefox 20+ */
  1947.   -webkit-flex-direction:row;
  1948.   flex-direction:row;
  1949.   height:200px;
  1950.   width: 630px;
  1951.   margin:0 auto;
  1952. }
  1953.  
  1954. /*   flex: none | [ <'flex-grow'> <'flex-shrink'>? || <'flex-basis'> ] */
  1955.  
  1956. /********Links and Map Flex Box ************/
  1957.  
  1958. .home #links-map-trans, .category #links-map-trans  {
  1959.   webkit-box-ordinal-group: 8;   /* OLD - iOS 6-, Safari 3.1-6 */
  1960.   -moz-box-ordinal-group: 8;      /* OLD - Firefox 19- */
  1961.   -ms-flex-order: 8;              /* TWEENER - IE 10 */
  1962.   -webkit-order: 8;               /* NEW - Chrome */
  1963.   order: 8;                       /* NEW, Spec - Opera 12.1, Firefox 20+ */
  1964.   display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
  1965.   display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
  1966.   display: -ms-flexbox;      /* TWEENER - IE 10 */
  1967.   display: -webkit-flex;     /* NEW - Chrome */
  1968.   display: flex;             /* NEW, Spec - Opera 12.1, Firefox 20+ */
  1969.   -webkit-flex-direction:row; /* Safari 6.1+ */
  1970.   flex-direction:row;
  1971.   margin: 0 auto;
  1972.   width: 630px;
  1973. }
  1974. .home #fiji-map-box, .category #fiji-map-box {
  1975.   webkit-box-ordinal-group: 9;   /* OLD - iOS 6-, Safari 3.1-6 */
  1976.   -moz-box-ordinal-group: 9;      /* OLD - Firefox 19- */
  1977.   -ms-flex-order: 9;              /* TWEENER - IE 10 */
  1978.   -webkit-order: 9;               /* NEW - Chrome */
  1979.   order: 9;                       /* NEW, Spec - Opera 12.1, Firefox 20+ */
  1980. }
  1981. .home #toptranslate, .category #toptranslate {
  1982.   webkit-box-ordinal-group: 10;   /* OLD - iOS 6-, Safari 3.1-6 */
  1983.   -moz-box-ordinal-group: 10;      /* OLD - Firefox 19- */
  1984.   -ms-flex-order: 10;              /* TWEENER - IE 10 */
  1985.   -webkit-order: 10;               /* NEW - Chrome */
  1986.   order: 10;                       /* NEW, Spec - Opera 12.1, Firefox 20+ */
  1987. }
  1988. .home  #topl-booknow, .category #topl-booknow  {
  1989.   webkit-box-ordinal-group: 11;   /* OLD - iOS 6-, Safari 3.1-6 */
  1990.   -moz-box-ordinal-group: 11;      /* OLD - Firefox 19- */
  1991.   -ms-flex-order: 11;              /* TWEENER - IE 10 */
  1992.   -webkit-order: 11;               /* NEW - Chrome */
  1993.   order: 11;                       /* NEW, Spec - Opera 12.1, Firefox 20+ */
  1994.   display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
  1995.   display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
  1996.   display: -ms-flexbox;      /* TWEENER - IE 10 */
  1997.   display: -webkit-flex;     /* NEW - Chrome */
  1998.   display: flex;             /* NEW, Spec - Opera 12.1, Firefox 20+ */
  1999.   -webkit-flex:2;
  2000.   flex: 2;
  2001.   background: url('images/shadowboxes/book-now-box-tablet.jpg') no-repeat;
  2002.   width:300px;
  2003. }
  2004.  
  2005. .home #searchpanel {
  2006.   webkit-box-ordinal-group: 12;   /* OLD - iOS 6-, Safari 3.1-6 */
  2007.   -moz-box-ordinal-group: 12;      /* OLD - Firefox 19- */
  2008.   -ms-flex-order: 12;              /* TWEENER - IE 10 */
  2009.   -webkit-order: 12;               /* NEW - Chrome */
  2010.   order: 12;                       /* NEW, Spec - Opera 12.1, Firefox 20+ */
  2011.   width: 630px;
  2012.   margin: 0 auto;
  2013. }
  2014. /* END links-trans  flexbox */
  2015.  
  2016. .home #content, .category #content {
  2017.   webkit-box-ordinal-group: 13;   /* OLD - iOS 6-, Safari 3.1-6 */
  2018.   -moz-box-ordinal-group: 13;      /* OLD - Firefox 19- */
  2019.   -ms-flex-order: 13;              /* TWEENER - IE 10 */
  2020.   -webkit-order: 13;               /* NEW - Chrome */
  2021.   order: 13;                       /* NEW, Spec - Opera 12.1, Firefox 20+ */
  2022.   margin: 0 auto;
  2023. }
  2024. .home #sidebar-bottom, .category  #sidebar-bottom, .page-news #sidebar-bottom {
  2025.     -webkit-box-ordinal-group: 14;   /* OLD - iOS 6-, Safari 3.1-6 */
  2026.     -moz-box-ordinal-group: 14;      /* OLD - Firefox 19- */
  2027.     -ms-flex-order: 14;              /* TWEENER - IE 10 */
  2028.     -webkit-order: 14;               /* NEW - Chrome */
  2029.     order: 14;                       /* NEW, Spec - Opera 12.1, Firefox 20+ */
  2030.   width: 630px;
  2031.   margin: 0 auto;
  2032. }
  2033.  
  2034.  
  2035. .home #sidebar-bottom ul, .category #sidebar-bottom ul, .page-news #sidebar-bottom ul {
  2036.   webkit-box-ordinal-group: 15;   /* OLD - iOS 6-, Safari 3.1-6 */
  2037.   -moz-box-ordinal-group: 15;      /* OLD - Firefox 19- */
  2038.   -ms-flex-order: 15;              /* TWEENER - IE 10 */
  2039.   -webkit-order: 15;               /* NEW - Chrome */
  2040.   order: 15;      
  2041.   display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
  2042.   display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
  2043.   display: -ms-flexbox;      /* TWEENER - IE 10 */
  2044.   display: -webkit-flex;     /* NEW - Chrome */
  2045.   display: flex;             /* NEW, Spec - Opera 12.1, Firefox 20+ */
  2046.   flex-direction: row;
  2047.   height:auto;
  2048.   -webkit-flex-wrap:wrap; /* Safari 6.1+ */
  2049.   flex-wrap:wrap;
  2050.   width:88%;
  2051. }
  2052.  
  2053. .home #sidebar-bottom .box2, .category #sidebar-bottom .box2,
  2054. .page-news #sidebar-bottom .box2 {
  2055.   width: 100%;
  2056. }
  2057.  
  2058.  
  2059. .home .sidepost, .category .sidepost, .page-news .sidepost {
  2060.   -webkit-box-flex:45% 1;
  2061.    -moz-box-flex:45% 1;
  2062.   -webkit-flex:45% 1;
  2063.   ms-flex:45% 1;
  2064.   flex:45% 1;
  2065. }
  2066.  
  2067. /**********************************************************
  2068. * NEWS PAGE STUFF
  2069. ************************************************************/
  2070.  
  2071. /**********************************************************
  2072. * General Styling of TABLET ITEMS
  2073. *********************************************************/
  2074.  
  2075. #header h1 {
  2076.   background-image: url("images/title-block-tablet.jpg");
  2077. }
  2078.  
  2079.  
  2080.  
  2081. #searchpanel {
  2082.   background-image: none;
  2083.   background-color:white;
  2084.   background: -webkit-linear-gradient(top, #CCDFEC, white); /* For Safari 5.1 to 6.0 */
  2085.   background: -o-linear-gradient(top, #CCDFEC, white); /* For Opera 11.1 to 12.0 */
  2086.   background: -moz-linear-gradient(top, #CCDFEC, white); /* For Firefox 3.6 to 15 */
  2087.   background: linear-gradient(top, #CCDFEC, white); /* Standard syntax */
  2088.   box-shadow:0 0 7px silver;
  2089.   webkit-box-shadow:0 0 7px silver;
  2090.   border: solid 6px white;
  2091.  /* height:40px;*/
  2092.   width:95%;
  2093.   }
  2094.  
  2095.  
  2096. .ts-menu, #subnav, #main {
  2097.   width: 100%;
  2098. }
  2099.  
  2100. .ts-menu {
  2101.   position: static;
  2102.   margin: 0 auto;
  2103.   top: 0px;
  2104. }
  2105. #phone-button, #email-button, #book-button, #ultimate-shark-button {
  2106.   width: 100%;
  2107.   float: none;
  2108. }
  2109.  
  2110. /**********************************************************************
  2111. * FLEX BOX ORDER CATEGORY PAGE TABLET
  2112. **********************************************************************/
  2113.  
  2114.  
  2115. #topdestination {
  2116.   width: 100%;
  2117.   height: 575px;
  2118.   margin: 0 auto;
  2119.   webkit-box-ordinal-group: 3;   /* OLD - iOS 6-, Safari 3.1-6 */
  2120.   -moz-box-ordinal-group: 3;      /* OLD - Firefox 19- */
  2121.   -ms-flex-order: 3;              /* TWEENER - IE 10 */
  2122.   -webkit-order: 3;               /* NEW - Chrome */
  2123.   order: 3;
  2124. }
  2125.  
  2126. #destinationcontent {
  2127.   width: 100%;
  2128.   webkit-box-ordinal-group: 3;   /* OLD - iOS 6-, Safari 3.1-6 */
  2129.   -moz-box-ordinal-group: 3;      /* OLD - Firefox 19- */
  2130.   -ms-flex-order: 3;              /* TWEENER - IE 10 */
  2131.   -webkit-order: 3;               /* NEW - Chrome */
  2132.   order: 3;
  2133.   display: -webkit-box;
  2134.   display: -moz-box;
  2135.   display: -ms-flexbox;
  2136.   display: -webkit-flex;
  2137.   display: flex;
  2138.   flex-direction: row;
  2139.   height: auto;
  2140.   -webkit-flex-wrap: wrap;
  2141.   flex-wrap: wrap;
  2142. }
  2143.  
  2144. .destinationblock {
  2145.   -webkit-box-flex:45% 1;
  2146.    -moz-box-flex:45% 1;
  2147.   -webkit-flex:45% 1;
  2148.   ms-flex:45% 1;
  2149.   flex:45% 1;
  2150. }
  2151.  
  2152. /*************************************************
  2153. * Only one destination item in a row fix
  2154. **************************************************/
  2155.  
  2156. #destinationcontent div:last-child {
  2157.   -webkit-box-flex:0 auto;
  2158.   -moz-box-flex:0 auto;
  2159.   -webkit-flex:0 auto;
  2160.   ms-flex:0 auto;
  2161.   flex: 0 auto;
  2162.   width:100%;
  2163. }
  2164.  
  2165.  
  2166.  
  2167. /*************************************************
  2168. * Only one destination item in a row exceptions
  2169. * where there are two item
  2170. **************************************************/
  2171.  
  2172. .category-luxury #destinationcontent div:last-child,
  2173. .category-spa #destinationcontent div:last-child,
  2174. .category-sunshine-coast #destinationcontent div:last-child,
  2175. .category-nadi-and-denarau #destinationcontent div:last-child,
  2176. .category-mamanuca #destinationcontent div:last-child,
  2177. .category-yasawa #destinationcontent div:last-child,
  2178. .category-vanua-levu #destinationcontent div:last-child,
  2179. .category-kadavu #destinationcontent div:last-child {
  2180.   -webkit-box-flex:45% 1;
  2181.    -moz-box-flex:45% 1;
  2182.   -webkit-flex:45% 1;
  2183.   ms-flex:45% 1;
  2184.   flex:45% 1;
  2185. }
  2186.  
  2187. /****************************************
  2188. SOME MORE GENERAL TABLET STYLING
  2189. ****************************************/
  2190.  
  2191. #subnav {
  2192.   padding: 50px 0 50px;
  2193.   color: #00F;
  2194.   font-size: 13px;
  2195.   width: 100%;
  2196.   position: static;
  2197. }
  2198.  
  2199. }
  2200.  
  2201. /************************************************************
  2202. * RESPONSIVE VIEW FOR SMARTPHONES PORTRAIT  
  2203. ************************************************************/
  2204.  
  2205. @media only screen and (max-width : 650px) {
  2206.    
  2207.  
  2208. /* **********************************************************
  2209. * Top Header and Top Bar Fix for Slicknav Addition
  2210. *************************************************************/
  2211.  
  2212. #top-header {
  2213.   display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
  2214.   display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
  2215.   display: -ms-flexbox;      /* TWEENER - IE 10 */
  2216.   display: -webkit-flex;     /* NEW - Chrome */
  2217.   display: flex
  2218.   -webkit-flex-direction:column;
  2219.   flex-direction:column;
  2220.   -webkit-flex-wrap:wrap;
  2221.   flex-wrap:wrap;
  2222. }
  2223.  
  2224.  
  2225. /************************************************************
  2226. * SMARTPHONES HIDDEN ITEMS
  2227. ************************************************************/
  2228.  
  2229. #black-bar {
  2230.   display: none;
  2231. }
  2232. #slogan-bar {
  2233.   display:none;
  2234.   }
  2235. #logo {
  2236.     display:none;
  2237. }
  2238.  
  2239. .footer-menu li:nth-last-child(-n+1) {
  2240.   display:none;
  2241. }
  2242.  
  2243.  
  2244. single #toplinks, .single #fiji-map-box, .single #toptranslate,
  2245. .single #loacatethis, .single-post #sidebar-bottom,
  2246.  .category #links-trans, .category #sidebar-bottom {
  2247.     display:none;
  2248.     }
  2249.  
  2250. #resortpic {
  2251.   background-size: 100% 100%;
  2252.   background-repeat: no-repeat;
  2253. }
  2254. .category #links-trans, .category #searchpanel {
  2255.   display: none;
  2256. }
  2257.  
  2258. .home #links-map-trans {
  2259.   display:none;
  2260.  
  2261. }
  2262.  
  2263. #nggpanel {display:none;
  2264. }
  2265.  
  2266. /****** GALLERY FIXES RESORT PAGES *********/
  2267.  
  2268. #topgallery {
  2269.     width: 100%;
  2270.     height:100%;
  2271.     margin-left:0px;
  2272. }
  2273.  
  2274. .ngg-galleryoverview div.pic img {
  2275.   width: 100%;
  2276.   height: 100%;
  2277. }
  2278.  
  2279. #topgallery #resortpic {
  2280.     display: block;
  2281.     height: 100%;
  2282. }
  2283.  
  2284. #topgallery #picborder {
  2285.   margin: 0px 10px 10px 10px;
  2286.   height: 100%;
  2287.   width:93%;
  2288.   padding: 15px 5px 10px 5px;
  2289. }
  2290.  
  2291.  
  2292. #ngglist {
  2293.     display:none;
  2294. }
  2295.  
  2296.  
  2297. /** FIJI MAP FIX SMARTPHONE **/
  2298.  
  2299. .box3 img {
  2300.     width: 100%;
  2301.     height: 100%;
  2302. }
  2303.  
  2304. img.ui-datepicker-trigger {
  2305.     width: 20px;
  2306. }
  2307.  
  2308. /**************************************************************************
  2309. * RESORT PAGE OR SINGLE PAGE SMARTPHONE FIXES
  2310. ***************************************************************************/
  2311.  
  2312. /*.single-post .ui-tabs .ui-tabs-nav {
  2313.   display:none;
  2314. }
  2315. */
  2316.  
  2317. .single #links-trans {
  2318.     float: left;
  2319.     width: 90%;
  2320.     padding-left: 15px;
  2321. }
  2322.  
  2323.  
  2324. /**************************************************************************
  2325. * CONTACT PAGE SMARTPHONE
  2326. ***************************************************************************/
  2327. #contactform input.text, #contactform textarea {
  2328.     width: 150px;
  2329. }
  2330.  
  2331. .page-contact .box3 {
  2332.     background: none;
  2333.     border: 5px solid #fff;
  2334. }
  2335.  
  2336. /**************************************************************************
  2337. * SEARCH PANEL SMARTPHONE
  2338. ***************************************************************************/
  2339.  
  2340. #searchpanel {
  2341.   display:none;
  2342.   background-image: none;
  2343.   background-color:white;
  2344.   background: -webkit-linear-gradient(top, #CCDFEC, white); /* For Safari 5.1 to 6.0 */
  2345.   background: -o-linear-gradient(top, #CCDFEC, white); /* For Opera 11.1 to 12.0 */
  2346.   background: -moz-linear-gradient(top, #CCDFEC, white); /* For Firefox 3.6 to 15 */
  2347.   background: linear-gradient(top, #CCDFEC, white); /* Standard syntax */
  2348.   box-shadow:0 0 7px silver;
  2349.   webkit-box-shadow:0 0 7px silver;
  2350.   border: solid 6px white;
  2351.  /* height:40px;*/
  2352.   width:95%;
  2353. }
  2354.  
  2355. /************************************************************
  2356. * SMARTPHONES PORTRAIT  HEADERS
  2357. ************************************************************/
  2358.  
  2359. #header h1 {
  2360.      float: left;
  2361.      width:100%;
  2362. }
  2363.  
  2364. #header h2 {
  2365.     margin: 10px 0 0 0;
  2366.     width:100%;
  2367. }
  2368.  
  2369. /**********************************************************
  2370. * HOME AND CATEGORY Flex Box Main Container SMARTPHONES
  2371. ***********************************************************/
  2372.      
  2373. .home #main, .category #main, .single #main, .page #main {
  2374.     display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
  2375.     display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
  2376.     display: -ms-flexbox;      /* TWEENER - IE 10 */
  2377.     display: -webkit-flex;     /* NEW - Chrome */
  2378.     display: flex;             /* NEW, Spec - Opera 12.1, Firefox 20+ */
  2379.     -webkit-flex-direction:column;
  2380.     flex-direction:column;
  2381.     -webkit-flex-wrap:wrap;
  2382.     flex-wrap:wrap;
  2383.     padding:5px;
  2384.     width: 450px;
  2385.     }
  2386.    
  2387. /*************************************************************
  2388. * Flex Box Main Box Items SMARTPHONES
  2389. *************************************************************/
  2390.    
  2391. .home #header {
  2392.   webkit-box-ordinal-group: 1;   /* OLD - iOS 6-, Safari 3.1-6 */
  2393.   -moz-box-ordinal-group: 1;      /* OLD - Firefox 19- */
  2394.   -ms-flex-order: 1;              /* TWEENER - IE 10 */
  2395.   -webkit-order: 1;               /* NEW - Chrome */
  2396.   order: 1;                       /* NEW, Spec - Opera 12.1, Firefox 20+ */
  2397.   margin: auto;
  2398.   width: 350px;
  2399.   }
  2400.  
  2401. .home #subnav {
  2402.   webkit-box-ordinal-group: 2;   /* OLD - iOS 6-, Safari 3.1-6 */
  2403.   -moz-box-ordinal-group: 2;      /* OLD - Firefox 19- */
  2404.   -ms-flex-order: 2;              /* TWEENER - IE 10 */
  2405.   -webkit-order: 2;               /* NEW - Chrome */
  2406.   order: 2;                       /* NEW, Spec - Opera 12.1, Firefox 20+ */
  2407.   margin: auto;
  2408.   width: 350px;
  2409.   padding:0;
  2410.   }
  2411. .home #dummyblock {
  2412.   webkit-box-ordinal-group: 3;   /* OLD - iOS 6-, Safari 3.1-6 */
  2413.   -moz-box-ordinal-group: 3;      /* OLD - Firefox 19- */
  2414.   -ms-flex-order: 3;              /* TWEENER - IE 10 */
  2415.   -webkit-order: 3;               /* NEW - Chrome */
  2416.   order: 3;                       /* NEW, Spec - Opera 12.1, Firefox 20+ */
  2417. }
  2418.  
  2419. .home #topslider {
  2420.   display:none;
  2421.   webkit-box-ordinal-group: 4;   /* OLD - iOS 6-, Safari 3.1-6 */
  2422.   -moz-box-ordinal-group: 4;      /* OLD - Firefox 19- */
  2423.   -ms-flex-order: 4;              /* TWEENER - IE 10 */
  2424.   -webkit-order: 4;               /* NEW - Chrome */
  2425.   order: 4;                       /* NEW, Spec - Opera 12.1, Firefox 20+ */
  2426.   margin: 0 auto 10px auto;
  2427.   width: 630px;
  2428.     }        
  2429.  
  2430. /******************************************************************
  2431. * Links-trans  Flexbox SMARTPHONES
  2432. *******************************************************************/
  2433.  
  2434. .home  #links-trans {
  2435.   webkit-box-ordinal-group: 5;   /* OLD - iOS 6-, Safari 3.1-6 */
  2436.   -moz-box-ordinal-group: 5;      /* OLD - Firefox 19- */
  2437.   -ms-flex-order: 5;              /* TWEENER - IE 10 */
  2438.   -webkit-order: 5;               /* NEW - Chrome */
  2439.   order: 5;                       /* NEW, Spec - Opera 12.1, Firefox 20+ */
  2440.   display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
  2441.   display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
  2442.   display: -ms-flexbox;      /* TWEENER - IE 10 */
  2443.   display: -webkit-flex;     /* NEW - Chrome */
  2444.   display: flex;             /* NEW, Spec - Opera 12.1, Firefox 20+ */
  2445.   -webkit-flex-direction:column;
  2446.   flex-direction:column;
  2447.   margin: auto;
  2448.   width: 350px;
  2449.  
  2450. }
  2451.  
  2452. .home #topl-specials {
  2453.   webkit-box-ordinal-group: 6;   /* OLD - iOS 6-, Safari 3.1-6 */
  2454.   -moz-box-ordinal-group: 6;      /* OLD - Firefox 19- */
  2455.   -ms-flex-order: 6;              /* TWEENER - IE 10 */
  2456.   -webkit-order: 6;               /* NEW - Chrome */
  2457.   order: 6;                       /* NEW, Spec - Opera 12.1, Firefox 20+ */
  2458.   background: url('images/shadowboxes/fiji-specials-box-tablet.jpg') no-repeat;
  2459.   width:300px;
  2460.   height:120px;
  2461.   margin-right: 30px;
  2462. }
  2463. .home #toplinks {
  2464.   webkit-box-ordinal-group: 7;   /* OLD - iOS 6-, Safari 3.1-6 */
  2465.   -moz-box-ordinal-group: 7;      /* OLD - Firefox 19- */
  2466.   -ms-flex-order: 7;              /* TWEENER - IE 10 */
  2467.   -webkit-order: 7;               /* NEW - Chrome */
  2468.   order: 7;                       /* NEW, Spec - Opera 12.1, Firefox 20+ */
  2469.   display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
  2470.   display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
  2471.   display: -ms-flexbox;      /* TWEENER - IE 10 */
  2472.   display: -webkit-flex;     /* NEW - Chrome */
  2473.   display: flex;             /* NEW, Spec - Opera 12.1, Firefox 20+ */
  2474.   -webkit-flex-direction:column;
  2475.   flex-direction:column;
  2476.   height:275px;
  2477.   width: 100%;
  2478.   margin:0 auto;
  2479. }
  2480.  
  2481. /*************************************************************************
  2482. * Links and Map Flex Box SMARTPHONES
  2483. **************************************************************************/
  2484.  
  2485.  
  2486. .home #fiji-map-box {
  2487.   webkit-box-ordinal-group: 9;   /* OLD - iOS 6-, Safari 3.1-6 */
  2488.   -moz-box-ordinal-group: 9;      /* OLD - Firefox 19- */
  2489.   -ms-flex-order: 9;              /* TWEENER - IE 10 */
  2490.   -webkit-order: 9;               /* NEW - Chrome */
  2491.   order: 9;                       /* NEW, Spec - Opera 12.1, Firefox 20+ */
  2492. }
  2493. .home #toptranslate {
  2494.   webkit-box-ordinal-group: 10;   /* OLD - iOS 6-, Safari 3.1-6 */
  2495.   -moz-box-ordinal-group: 10;      /* OLD - Firefox 19- */
  2496.   -ms-flex-order: 10;              /* TWEENER - IE 10 */
  2497.   -webkit-order: 10;               /* NEW - Chrome */
  2498.   order: 10;                       /* NEW, Spec - Opera 12.1, Firefox 20+ */
  2499. }
  2500. .home  #topl-booknow {
  2501.   webkit-box-ordinal-group: 11;   /* OLD - iOS 6-, Safari 3.1-6 */
  2502.   -moz-box-ordinal-group: 11;      /* OLD - Firefox 19- */
  2503.   -ms-flex-order: 11;              /* TWEENER - IE 10 */
  2504.   -webkit-order: 11;               /* NEW - Chrome */
  2505.   order: 11;                       /* NEW, Spec - Opera 12.1, Firefox 20+ */
  2506.   display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
  2507.   display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
  2508.   display: -ms-flexbox;      /* TWEENER - IE 10 */
  2509.   display: -webkit-flex;     /* NEW - Chrome */
  2510.   display: flex;             /* NEW, Spec - Opera 12.1, Firefox 20+ */
  2511.   -webkit-flex:2;
  2512.   flex: 2;
  2513.   background: url('images/shadowboxes/book-now-box-tablet.jpg') no-repeat;
  2514.   width:300px;
  2515. }
  2516.  
  2517. .home #searchpanel {
  2518.   display:none;
  2519.   webkit-box-ordinal-group: 12;   /* OLD - iOS 6-, Safari 3.1-6 */
  2520.   -moz-box-ordinal-group: 12;      /* OLD - Firefox 19- */
  2521.   -ms-flex-order: 12;              /* TWEENER - IE 10 */
  2522.   -webkit-order: 12;               /* NEW - Chrome */
  2523.   order: 12;                       /* NEW, Spec - Opera 12.1, Firefox 20+ */
  2524.   width: 530px;
  2525.   margin: 0 auto;
  2526. }
  2527. /*********************************************************************************
  2528. * END links-trans  flexbox SMARTPHONES
  2529. **********************************************************************************/
  2530.  
  2531. .home #content {
  2532.   display:none;
  2533.   webkit-box-ordinal-group: 13;   /* OLD - iOS 6-, Safari 3.1-6 */
  2534.   -moz-box-ordinal-group: 13;      /* OLD - Firefox 19- */
  2535.   -ms-flex-order: 13;              /* TWEENER - IE 10 */
  2536.   -webkit-order: 13;               /* NEW - Chrome */
  2537.   order: 13;                       /* NEW, Spec - Opera 12.1, Firefox 20+ */
  2538.   margin: 0 auto;
  2539. }
  2540. .home  #sidebar-bottom, .page-news #sidebar-bottom {
  2541.     -webkit-box-ordinal-group: 14;   /* OLD - iOS 6-, Safari 3.1-6 */
  2542.     -moz-box-ordinal-group: 14;      /* OLD - Firefox 19- */
  2543.     -ms-flex-order: 14;              /* TWEENER - IE 10 */
  2544.     -webkit-order: 14;               /* NEW - Chrome */
  2545.     order: 14;                       /* NEW, Spec - Opera 12.1, Firefox 20+ */
  2546.   width: 100%;
  2547.   margin: 0 auto;
  2548. }
  2549.  
  2550. .home #sidebar-bottom ul, .page-news #sidebar-bottom ul {
  2551.   webkit-box-ordinal-group: 15;   /* OLD - iOS 6-, Safari 3.1-6 */
  2552.   -moz-box-ordinal-group: 15;      /* OLD - Firefox 19- */
  2553.   -ms-flex-order: 15;              /* TWEENER - IE 10 */
  2554.   -webkit-order: 15;               /* NEW - Chrome */
  2555.   order: 15;      
  2556.   display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
  2557.   display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
  2558.   display: -ms-flexbox;      /* TWEENER - IE 10 */
  2559.   display: -webkit-flex;     /* NEW - Chrome */
  2560.   display: flex;             /* NEW, Spec - Opera 12.1, Firefox 20+ */
  2561.   flex-direction: column;
  2562.   height:auto;
  2563.   -webkit-flex-wrap:wrap; /* Safari 6.1+ */
  2564.   flex-wrap:wrap;
  2565.   width:88%;
  2566. }
  2567.  
  2568. .home #sidebar-bottom .box2, .page-news #sidebar-bottom .box2 {
  2569.   width: 100%;
  2570. }
  2571.  
  2572. .home .sidepost, .page-news .sidepost {
  2573.   -webkit-box-flex:45% 1;
  2574.    -moz-box-flex:45% 1;
  2575.   -webkit-flex:45% 1;
  2576.   ms-flex:45% 1;
  2577.   flex:45% 1;
  2578. }
  2579.  
  2580. /* General Styling of Mobile Items *************/
  2581.  
  2582. #header h1 {
  2583.   background-image: url("images/title-block-mobile.jpg");
  2584. }
  2585.  
  2586.  
  2587. .page #content {
  2588.   width:98%;
  2589. }  
  2590. .page .box3 {
  2591.   width:100%;
  2592. }
  2593.  
  2594.   .ts-menu, #subnav, #main {
  2595.     width: 100%;
  2596.   }
  2597.  
  2598.   .ts-menu {
  2599.     position: static;
  2600.     margin: 0 auto;
  2601.     top: 0px;
  2602.   }
  2603.   #phone-button, #email-button, #book-button, #ultimate-shark-button {
  2604.     width: 100%;
  2605.     float: left;
  2606.   }
  2607.  
  2608. /* General Styling of Mobile Items Still *************/
  2609.  
  2610.   #destinationcontent {
  2611.     width: 100%;
  2612.   }
  2613.   #topdestination {
  2614.     display:none;
  2615.     width: 100%;
  2616.     height: 575px;
  2617.     margin: 0 auto;
  2618.     float: left;
  2619.   }
  2620.   #subnav {
  2621.     padding: 50px 0 50px;
  2622.     color: #00F;
  2623.     font-size: 13px;
  2624.     width: 100%;
  2625.     position: static;
  2626.   }
  2627.  
  2628.  
  2629. #header h2 {
  2630.     background:url('images/site-slogan-24-mobile.png');
  2631.     background-repeat:no-repeat;
  2632. }
  2633.  
  2634. #menu-footer {
  2635.     width: 90%;
  2636. }
  2637.  
  2638. }
  2639.  
  2640. /*************************************************************************
  2641. * SMARTPHONE FOOTER MENU AND MAIN TWEAKS DIFFERENT BREAKPOINTS
  2642. **************************************************************************/
  2643.  
  2644. @media only screen and (max-width : 950px) {
  2645.  
  2646. .footer-menu li:nth-last-child(-n+1) {
  2647.   display:none;
  2648. }
  2649. }
  2650. @media only screen and (max-width : 795px) {
  2651.  
  2652. .footer-menu li:nth-last-child(-n+3) {
  2653.   display:none;
  2654. }
  2655. }
  2656.  
  2657. /** END MEDIA QUERY ***/
  2658.  
  2659. @media only screen and (max-width : 625px) {
  2660.  
  2661. .home #main, .category #main, .single #main, .page #main {
  2662.   width:350px;
  2663. }
  2664.  
  2665. .footer-menu li:nth-last-child(-n+4) {
  2666.   display:none;
  2667. }
  2668. }
  2669.  
  2670. /** END MEDIA QUERY ***/
  2671.  
  2672. @media only screen and (max-width : 530px) {
  2673.  
  2674. .footer-menu li:nth-last-child(-n+5) {
  2675.   display:none;
  2676. }
  2677.  
  2678. #topgallery #picborder {
  2679.   width:92%;
  2680. }
  2681. }
  2682.  
  2683. /** END MEDIA QUERY ***/
  2684.  
  2685. @media only screen and (max-width : 450px) {
  2686.  
  2687. .footer-menu li:nth-last-child(-n+6) {
  2688.   display:none;
  2689. }
  2690.  
  2691. #topgallery #picborder {
  2692.   width:91%;
  2693. }
  2694.  
  2695. }
  2696.  
  2697. /************************************************
  2698. * TINY DEVICES LESS THAN 360px
  2699. *************************************************/
  2700. @media only screen and (max-width : 360px) {
  2701.  
  2702. .home #main, .category #main, .single #main, .page #main {
  2703.   width:300px;
  2704. }
  2705.  
  2706. #topgallery #picborder {
  2707.   width:90%;
  2708. }
  2709.  
  2710. .destimage {
  2711.     width: 100%
  2712. }
  2713.  
  2714. .destinationblock {
  2715.   float: left;
  2716.   width: 280px;
  2717. }
  2718.  
  2719. .destinationblock img {
  2720.     margin: 5px 0 0 5px;
  2721.     width: 100%;
  2722. }
  2723.  
  2724. .destinationdetails {
  2725.   width: 280px;
  2726. }
  2727.   #header h2 {
  2728.     background: url('images/site-slogan-24-small-mobile.png');
  2729.     background-repeat: no-repeat;
  2730. }
  2731. #header h1 {
  2732.     background-image: url("images/title-block-small-mobile.jpg");
  2733. }
  2734. .footer-menu li:nth-last-child(-n+7) {
  2735.   display:none;
  2736. }
  2737.  
  2738. }
  2739. #menu-footer {
  2740.     width: 70%;
  2741. }
  2742. }
  2743.  
  2744. /** END MEDIA QUERY ***/
Advertisement
Advertisement
Advertisement
RAW Paste Data Copied
Advertisement