Advertisement
sandalzero

navigation.css

Sep 19th, 2019
132
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 60.76 KB | None | 0 0
  1. /*-----------------------------------------------------------------------------
  2.  
  3. - Revolution Slider 5.0 Navigatin Skin Style  -
  4.  
  5.  ARES SKIN
  6.  
  7. author:  ThemePunch
  8. email:      info@themepunch.com
  9. website:    http://www.themepunch.com
  10. -----------------------------------------------------------------------------*/
  11. .ares.tparrows {
  12.   cursor:pointer;
  13.   background:#fff;
  14.   min-width:60px;
  15.     min-height:60px;
  16.   position:absolute;
  17.   display:block;
  18.   z-index:100;
  19.     border-radius:50%;
  20. }
  21. .ares.tparrows:hover {
  22. }
  23. .ares.tparrows:before {
  24.   font-family: "revicons";
  25.   font-size:25px;
  26.   color:#aaa;
  27.   display:block;
  28.   line-height: 60px;
  29.   text-align: center;
  30.     -webkit-transition: color 0.3s;
  31.     -moz-transition: color 0.3s;
  32.     transition: color 0.3s;
  33.     z-index:2;
  34.     position:relative;
  35. }
  36. .ares.tparrows.tp-leftarrow:before {
  37.   content: "\e81f";
  38. }
  39. .ares.tparrows.tp-rightarrow:before {
  40.   content: "\e81e";
  41. }
  42. .ares.tparrows:hover:before {
  43.  color:#000;
  44.       }
  45. .ares .tp-title-wrap {
  46.   position:absolute;
  47.   z-index:1;
  48.   display:inline-block;
  49.   background:#fff;
  50.   min-height:60px;
  51.   line-height:60px;
  52.   top:0px;
  53.   margin-left:30px;
  54.   border-radius:0px 30px 30px 0px;
  55.   overflow:hidden;
  56.   -webkit-transition: -webkit-transform 0.3s;
  57.   transition: transform 0.3s;
  58.   transform:scaleX(0);  
  59.   -webkit-transform:scaleX(0);  
  60.   transform-origin:0% 50%;
  61.    -webkit-transform-origin:0% 50%;
  62. }
  63.  .ares.tp-rightarrow .tp-title-wrap {
  64.    right:0px;
  65.    margin-right:30px;margin-left:0px;
  66.    -webkit-transform-origin:100% 50%;
  67. border-radius:30px 0px 0px 30px;
  68.  }
  69. .ares.tparrows:hover .tp-title-wrap {
  70.   transform:scaleX(1) scaleY(1);
  71.     -webkit-transform:scaleX(1) scaleY(1);
  72. }
  73. .ares .tp-arr-titleholder {
  74.   position:relative;
  75.   -webkit-transition: -webkit-transform 0.3s;
  76.   transition: transform 0.3s;
  77.   transform:translateX(200px);  
  78.   text-transform:uppercase;
  79.   color:#000;
  80.   font-weight:400;
  81.   font-size:14px;
  82.   line-height:60px;
  83.   white-space:nowrap;
  84.   padding:0px 20px;
  85.   margin-left:10px;
  86.   opacity:0;
  87. }
  88.  
  89. .ares.tp-rightarrow .tp-arr-titleholder {
  90.    transform:translateX(-200px);
  91.    margin-left:0px; margin-right:10px;
  92.       }
  93.  
  94. .ares.tparrows:hover .tp-arr-titleholder {
  95.    transform:translateX(0px);
  96.    -webkit-transform:translateX(0px);
  97.   transition-delay: 0.1s;
  98.   opacity:1;
  99. }
  100.  
  101. /* BULLETS */
  102. .ares.tp-bullets {
  103. }
  104. .ares.tp-bullets:before {
  105.     content:" ";
  106.     position:absolute;
  107.     width:100%;
  108.     height:100%;
  109.     background:transparent;
  110.     padding:10px;
  111.     margin-left:-10px;margin-top:-10px;
  112.     box-sizing:content-box;
  113. }
  114. .ares .tp-bullet {
  115.     width:13px;
  116.     height:13px;
  117.     position:absolute;
  118.     background:#e5e5e5;
  119.     border-radius:50%;
  120.     cursor: pointer;
  121.     box-sizing:content-box;
  122. }
  123. .ares .tp-bullet:hover,
  124. .ares .tp-bullet.selected {
  125.     background:#fff;
  126. }
  127. .ares .tp-bullet-title {
  128.   position:absolute;
  129.   color:#888;
  130.   font-size:12px;
  131.   padding:0px 10px;
  132.   font-weight:600;
  133.   right:27px;
  134.   top:-4px;
  135.   background:#fff;
  136.   background:rgba(255,255,255,0.75);
  137.   visibility:hidden;
  138.   transform:translateX(-20px);
  139.   -webkit-transform:translateX(-20px);
  140.   transition:transform 0.3s;
  141.   -webkit-transition:transform 0.3s;
  142.   line-height:20px;
  143.   white-space:nowrap;
  144. }    
  145.  
  146. .ares .tp-bullet-title:after {
  147.     width: 0px;
  148.     height: 0px;
  149.     border-style: solid;
  150.     border-width: 10px 0 10px 10px;
  151.     border-color: transparent transparent transparent rgba(255,255,255,0.75);
  152.     content:" ";
  153.     position:absolute;
  154.     right:-10px;
  155.     top:0px;
  156. }
  157.    
  158. .ares .tp-bullet:hover .tp-bullet-title{
  159.   visibility:visible;
  160.    transform:translateX(0px);
  161.   -webkit-transform:translateX(0px);
  162. }
  163.  
  164. .ares .tp-bullet.selected:hover .tp-bullet-title {
  165.     background:#fff;
  166.         }
  167. .ares .tp-bullet.selected:hover .tp-bullet-title:after {
  168.   border-color:transparent transparent transparent #fff;
  169. }
  170. .ares.tp-bullets:hover .tp-bullet-title {
  171.         visibility:hidden;
  172. }
  173. .ares.tp-bullets:hover .tp-bullet:hover .tp-bullet-title {
  174.     visibility:visible;
  175.       }
  176.  
  177. /* TABS */
  178. .ares .tp-tab {
  179.   opacity:1;      
  180.   padding:10px;
  181.   box-sizing:border-box;
  182.   font-family: "Roboto", sans-serif;
  183.   border-bottom: 1px solid #e5e5e5;
  184.  }
  185. .ares .tp-tab-image
  186. {
  187.   width:60px;
  188.   height:60px; max-height:100%; max-width:100%;
  189.   position:relative;
  190.   display:inline-block;
  191.   float:left;
  192.  
  193. }
  194. .ares .tp-tab-content
  195. {
  196.     background:rgba(0,0,0,0);
  197.     position:relative;
  198.     padding:15px 15px 15px 85px;
  199.  left:0px;
  200.  overflow:hidden;
  201.  margin-top:-15px;
  202.     box-sizing:border-box;
  203.     color:#333;
  204.     display: inline-block;
  205.     width:100%;
  206.     height:100%;
  207.  position:absolute; }
  208. .ares .tp-tab-date
  209.   {
  210.   display:block;
  211.   color: #aaa;
  212.   font-weight:500;
  213.   font-size:12px;
  214.   margin-bottom:0px;
  215.   }
  216. .ares .tp-tab-title
  217. {
  218.     display:block; 
  219.     text-align:left;
  220.     color:#333;
  221.     font-size:14px;
  222.     font-weight:500;
  223.     text-transform:none;
  224.     line-height:17px;
  225. }
  226. .ares .tp-tab:hover,
  227. .ares .tp-tab.selected {
  228.     background:#eee;
  229. }
  230.  
  231. .ares .tp-tab-mask {
  232. }
  233.  
  234. /* MEDIA QUERIES */
  235. @media only screen and (max-width: 960px) {
  236.  
  237. }
  238. @media only screen and (max-width: 768px) {
  239.  
  240. }
  241.  
  242. /*-----------------------------------------------------------------------------
  243.  
  244. - Revolution Slider 5.0 Navigatin Skin Style  -
  245.  
  246.  CUSTOM SKIN
  247.  
  248. author:  ThemePunch
  249. email:      info@themepunch.com
  250. website:    http://www.themepunch.com
  251. -----------------------------------------------------------------------------*/
  252. /* ARROWS */
  253. .custom.tparrows {
  254.     cursor:pointer;
  255.     background:#000;
  256.     background:rgba(0,0,0,0.5);
  257.     width:40px;
  258.     height:40px;
  259.     position:absolute;
  260.     display:block;
  261.     z-index:10000;
  262. }
  263. .custom.tparrows:hover {
  264.     background:#000;
  265. }
  266. .custom.tparrows:before {
  267.     font-family: "revicons";
  268.     font-size:15px;
  269.     color:#fff;
  270.     display:block;
  271.     line-height: 40px;
  272.     text-align: center;
  273. }
  274. .custom.tparrows.tp-leftarrow:before {
  275.     content: "\e824";
  276. }
  277. .custom.tparrows.tp-rightarrow:before {
  278.     content: "\e825";
  279. }
  280.  
  281.  
  282.  
  283. /* BULLETS */
  284. .custom.tp-bullets {
  285. }
  286. .custom.tp-bullets:before {
  287.     content:" ";
  288.     position:absolute;
  289.     width:100%;
  290.     height:100%;
  291.     background:transparent;
  292.     padding:10px;
  293.     margin-left:-10px;margin-top:-10px;
  294.     box-sizing:content-box;
  295. }
  296. .custom .tp-bullet {
  297.     width:12px;
  298.     height:12px;
  299.     position:absolute;
  300.     background:#aaa;
  301.     background:rgba(125,125,125,0.5);
  302.     cursor: pointer;
  303.     box-sizing:content-box;
  304. }
  305. .custom .tp-bullet:hover,
  306. .custom .tp-bullet.selected {
  307.     background:rgb(125,125,125);
  308. }
  309. .custom .tp-bullet-image {
  310. }
  311. .custom .tp-bullet-title {
  312. }
  313.  
  314.  
  315. /* THUMBS */
  316.  
  317.  
  318. /* TABS */
  319.  
  320.  
  321. /*-----------------------------------------------------------------------------
  322.  
  323. - Revolution Slider 5.0 Navigatin Skin Style  -
  324.  
  325.  DIONE SKIN
  326.  
  327. author:  ThemePunch
  328. email:      info@themepunch.com
  329. website:    http://www.themepunch.com
  330. -----------------------------------------------------------------------------*/
  331. /* ARROWS */
  332. .dione.tparrows {
  333.   height:100%;
  334.   width:100px;
  335.   background:transparent;
  336.   background:rgba(0,0,0,0);
  337.   line-height:100%;
  338.   transition:all 0.3s;
  339. -webkit-transition:all 0.3s;
  340. }
  341.  
  342. .dione.tparrows:hover {
  343.  background:rgba(0,0,0,0.45);
  344.  }
  345. .dione .tp-arr-imgwrapper {
  346.  width:100px;
  347.  left:0px;
  348.  position:absolute;
  349.  height:100%;
  350.  top:0px;
  351.  overflow:hidden;
  352.  }
  353. .dione.tp-rightarrow .tp-arr-imgwrapper {
  354. left:auto;
  355. right:0px;
  356. }
  357.  
  358. .dione .tp-arr-imgholder {
  359. background-position:center center;
  360. background-size:cover;
  361. width:100px;
  362. height:100%;
  363. top:0px;
  364. visibility:hidden;
  365. transform:translateX(-50px);
  366. -webkit-transform:translateX(-50px);
  367. transition:all 0.3s;
  368. -webkit-transition:all 0.3s;
  369. opacity:0;
  370. left:0px;
  371. }
  372.  
  373. .dione.tparrows.tp-rightarrow .tp-arr-imgholder {
  374.   right:0px;
  375.   left:auto;
  376.   transform:translateX(50px);
  377.  -webkit-transform:translateX(50px);
  378. }
  379.  
  380. .dione.tparrows:before {
  381. position:absolute;
  382. line-height:30px;
  383. margin-left:-22px;
  384. top:50%;
  385. left:50%;
  386. font-size:30px;
  387. margin-top:-15px;
  388. transition:all 0.3s;
  389. -webkit-transition:all 0.3s;
  390. }
  391.  
  392. .dione.tparrows.tp-rightarrow:before {
  393. margin-left:6px;
  394. }
  395.  
  396. .dione.tparrows:hover:before {
  397.   transform:translateX(-20px);
  398. -webkit-transform:translateX(-20px);
  399. opacity:0;
  400. }
  401.  
  402. .dione.tparrows.tp-rightarrow:hover:before {
  403.   transform:translateX(20px);
  404. -webkit-transform:translateX(20px);
  405. }
  406.  
  407. .dione.tparrows:hover .tp-arr-imgholder {
  408.  transform:translateX(0px);
  409. -webkit-transform:translateX(0px);
  410. opacity:1;
  411. visibility:visible;
  412. }
  413.  
  414.  
  415.  
  416. /* BULLETS */
  417. .dione .tp-bullet {
  418.     opacity:1;
  419.     width:50px;
  420.     height:50px;    
  421.     padding:3px;
  422.     background:#000;
  423.     background-color:rgba(0,0,0,0.25);
  424.     margin:0px;
  425.     box-sizing:border-box;
  426.     transition:all 0.3s;
  427.     -webkit-transition:all 0.3s;
  428.  
  429.   }
  430.  
  431. .dione .tp-bullet-image {
  432.    display:block;
  433.    box-sizing:border-box;
  434.    position:relative;
  435.     -webkit-box-shadow: inset 5px 5px 10px 0px rgba(0,0,0,0.25);
  436.   -moz-box-shadow: inset 5px 5px 10px 0px rgba(0,0,0,0.25);
  437.   box-shadow: inset 5px 5px 10px 0px rgba(0,0,0,0.25);
  438.   width:44px;
  439.   height:44px;
  440.   background-size:cover;
  441.   background-position:center center;
  442.  }  
  443. .dione .tp-bullet-title {
  444.      position:absolute;
  445.    bottom:65px;
  446.      display:inline-block;
  447.      left:50%;
  448.      background:#000;
  449.      background:rgba(0,0,0,0.75);
  450.      color:#fff;
  451.      padding:10px 30px;
  452.      border-radius:4px;
  453.    -webkit-border-radius:4px;
  454.      opacity:0;
  455.       transition:all 0.3s;
  456.     -webkit-transition:all 0.3s;
  457.     transform: translateZ(0.001px) translateX(-50%) translateY(14px);
  458.     transform-origin:50% 100%;
  459.     -webkit-transform: translateZ(0.001px) translateX(-50%) translateY(14px);
  460.     -webkit-transform-origin:50% 100%;
  461.     opacity:0;
  462.     white-space:nowrap;
  463.  }
  464.  
  465. .dione .tp-bullet:hover .tp-bullet-title {
  466.      transform:rotateX(0deg) translateX(-50%);
  467.     -webkit-transform:rotateX(0deg) translateX(-50%);
  468.     opacity:1;
  469. }
  470.  
  471. .dione .tp-bullet.selected,
  472. .dione .tp-bullet:hover  {
  473.  
  474.    background: rgba(255,255,255,1);
  475.   background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(119,119,119,1) 100%);
  476.   background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(255,255,255,1)), color-stop(100%, rgba(119,119,119,1)));
  477.   background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(119,119,119,1) 100%);
  478.   background: -o-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(119,119,119,1) 100%);
  479.   background: -ms-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(119,119,119,1) 100%);
  480.   background: linear-gradient(to bottom, rgba(255,255,255,1) 0%, rgba(119,119,119,1) 100%);
  481.   filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#ffffff", endColorstr="#777777", GradientType=0 );
  482.  
  483.       }
  484. .dione .tp-bullet-title:after {
  485.         content:" ";
  486.         position:absolute;
  487.         left:50%;
  488.         margin-left:-8px;
  489.         width: 0;
  490.     height: 0;
  491.     border-style: solid;
  492.     border-width: 8px 8px 0 8px;
  493.     border-color: rgba(0,0,0,0.75) transparent transparent transparent;
  494.         bottom:-8px;
  495.    }
  496.  
  497.  
  498. /*-----------------------------------------------------------------------------
  499.  
  500. - Revolution Slider 5.0 Navigatin Skin Style  -
  501.  
  502.  ERINYEN SKIN
  503.  
  504. author:  ThemePunch
  505. email:      info@themepunch.com
  506. website:    http://www.themepunch.com
  507. -----------------------------------------------------------------------------*/
  508. /* ARROWS */
  509. .erinyen.tparrows {
  510.   cursor:pointer;
  511.   background:#000;
  512.   background:rgba(0,0,0,0.5);
  513.   min-width:70px;
  514.   min-height:70px;
  515.   position:absolute;
  516.   display:block;
  517.   z-index:1000;
  518.   border-radius:35px;  
  519. }
  520.  
  521. .erinyen.tparrows:before {
  522.   font-family: "revicons";
  523.   font-size:20px;
  524.   color:#fff;
  525.   display:block;
  526.   line-height: 70px;
  527.   text-align: center;    
  528.   z-index:2;
  529.   position:relative;
  530. }
  531. .erinyen.tparrows.tp-leftarrow:before {
  532.   content: "\e824";
  533. }
  534. .erinyen.tparrows.tp-rightarrow:before {
  535.   content: "\e825";
  536. }
  537.  
  538. .erinyen .tp-title-wrap {
  539.   position:absolute;
  540.   z-index:1;
  541.   display:inline-block;
  542.   background:#000;
  543.   background:rgba(0,0,0,0.5);
  544.   min-height:70px;
  545.   line-height:70px;
  546.   top:0px;
  547.   margin-left:0px;
  548.   border-radius:35px;
  549.   overflow:hidden;
  550.   transition: opacity 0.3s;
  551.   -webkit-transition:opacity 0.3s;
  552.   -moz-transition:opacity 0.3s;
  553.   -webkit-transform: scale(0);
  554.   -moz-transform: scale(0);
  555.   transform: scale(0);  
  556.   visibility:hidden;
  557.   opacity:0;
  558. }
  559.  
  560. .erinyen.tparrows:hover .tp-title-wrap{
  561.   -webkit-transform: scale(1);
  562.   -moz-transform: scale(1);
  563.   transform: scale(1);
  564.   opacity:1;
  565.   visibility:visible;
  566. }
  567.        
  568.  .erinyen.tp-rightarrow .tp-title-wrap {
  569.    right:0px;
  570.    margin-right:0px;margin-left:0px;
  571.    -webkit-transform-origin:100% 50%;
  572.   border-radius:35px;
  573.   padding-right:20px;
  574.   padding-left:10px;
  575.  }
  576.  
  577.  
  578. .erinyen.tp-leftarrow .tp-title-wrap {
  579.    padding-left:20px;
  580.   padding-right:10px;
  581. }
  582.  
  583. .erinyen .tp-arr-titleholder {
  584.   letter-spacing: 3px;
  585.    position:relative;
  586.   -webkit-transition: -webkit-transform 0.3s;
  587.   transition: transform 0.3s;
  588.   transform:translateX(200px);  
  589.   text-transform:uppercase;
  590.   color:#fff;
  591.   font-weight:600;
  592.   font-size:13px;
  593.   line-height:70px;
  594.   white-space:nowrap;
  595.   padding:0px 20px;
  596.   margin-left:11px;
  597.   opacity:0;  
  598. }
  599.  
  600. .erinyen .tp-arr-imgholder {
  601.   width:100%;
  602.   height:100%;
  603.   position:absolute;
  604.   top:0px;
  605.   left:0px;
  606.   background-position:center center;
  607.   background-size:cover;
  608.     }
  609.  .erinyen .tp-arr-img-over {
  610.    width:100%;
  611.   height:100%;
  612.   position:absolute;
  613.   top:0px;
  614.   left:0px;
  615.    background:#000;
  616.    background:rgba(0,0,0,0.5);
  617.         }
  618. .erinyen.tp-rightarrow .tp-arr-titleholder {
  619.    transform:translateX(-200px);
  620.    margin-left:0px; margin-right:11px;
  621.       }
  622.  
  623. .erinyen.tparrows:hover .tp-arr-titleholder {
  624.    transform:translateX(0px);
  625.    -webkit-transform:translateX(0px);
  626.   transition-delay: 0.1s;
  627.   opacity:1;
  628. }
  629.  
  630. /* BULLETS */
  631. .erinyen.tp-bullets {
  632. }
  633. .erinyen.tp-bullets:before {
  634.     content:" ";
  635.     position:absolute;
  636.     width:100%;
  637.     height:100%;
  638.     background: #555555; /* old browsers */
  639.     background: -moz-linear-gradient(top,  #555555 0%, #222222 100%); /* ff3.6+ */
  640.     background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#555555), color-stop(100%,#222222)); /* chrome,safari4+ */
  641.     background: -webkit-linear-gradient(top,  #555555 0%,#222222 100%); /* chrome10+,safari5.1+ */
  642.     background: -o-linear-gradient(top,  #555555 0%,#222222 100%); /* opera 11.10+ */
  643.     background: -ms-linear-gradient(top,  #555555 0%,#222222 100%); /* ie10+ */
  644.     background: linear-gradient(to bottom,  #555555 0%,#222222 100%); /* w3c */
  645.     filter: progid:dximagetransform.microsoft.gradient( startcolorstr="#555555", endcolorstr="#222222",gradienttype=0 ); /* ie6-9 */
  646.     padding:10px 15px;
  647.     margin-left:-15px;margin-top:-10px;
  648.     box-sizing:content-box;
  649.    border-radius:10px;
  650.    box-shadow:0px 0px 2px 1px rgba(33,33,33,0.3);
  651. }
  652. .erinyen .tp-bullet {
  653.     width:13px;
  654.     height:13px;
  655.     position:absolute;
  656.     background:#111;   
  657.     border-radius:50%;
  658.     cursor: pointer;
  659.     box-sizing:content-box;
  660. }
  661. .erinyen .tp-bullet:hover,
  662. .erinyen .tp-bullet.selected {
  663.     background: #e5e5e5; /* old browsers */
  664. background: -moz-linear-gradient(top,  #e5e5e5 0%, #999999 100%); /* ff3.6+ */
  665. background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#e5e5e5), color-stop(100%,#999999)); /* chrome,safari4+ */
  666. background: -webkit-linear-gradient(top,  #e5e5e5 0%,#999999 100%); /* chrome10+,safari5.1+ */
  667. background: -o-linear-gradient(top,  #e5e5e5 0%,#999999 100%); /* opera 11.10+ */
  668. background: -ms-linear-gradient(top,  #e5e5e5 0%,#999999 100%); /* ie10+ */
  669. background: linear-gradient(to bottom,  #e5e5e5 0%,#999999 100%); /* w3c */
  670. filter: progid:dximagetransform.microsoft.gradient( startcolorstr="#e5e5e5", endcolorstr="#999999",gradienttype=0 ); /* ie6-9 */
  671.   border:1px solid #555;
  672.   width:12px;height:12px;
  673. }
  674. .erinyen .tp-bullet-image {
  675. }
  676. .erinyen .tp-bullet-title {
  677. }
  678.  
  679.  
  680. /* THUMBS */
  681. .erinyen .tp-thumb {
  682. opacity:1
  683. }
  684.  
  685. .erinyen .tp-thumb-over {
  686.   background:#000;
  687.   background:rgba(0,0,0,0.25);
  688.   width:100%;
  689.   height:100%;
  690.   position:absolute;
  691.   top:0px;
  692.   left:0px;
  693.   z-index:1;
  694.   -webkit-transition:all 0.3s;
  695.   transition:all 0.3s;
  696. }
  697.  
  698. .erinyen .tp-thumb-more:before {
  699.   font-family: "revicons";
  700.   font-size:12px;
  701.   color:#aaa;
  702.   color:rgba(255,255,255,0.75);
  703.   display:block;
  704.   line-height: 12px;
  705.   text-align: left;    
  706.   z-index:2;
  707.   position:absolute;
  708.   top:20px;
  709.   right:20px;
  710.   z-index:2;
  711. }
  712. .erinyen .tp-thumb-more:before {
  713.   content: "\e825";
  714. }
  715.  
  716. .erinyen .tp-thumb-title {
  717.   font-family:"Raleway";
  718.   letter-spacing:1px;
  719.   font-size:12px;
  720.   color:#fff;
  721.   display:block;
  722.   line-height: 15px;
  723.   text-align: left;    
  724.   z-index:2;
  725.   position:absolute;
  726.   top:0px;
  727.   left:0px;
  728.   z-index:2;
  729.   padding:20px 35px 20px 20px;
  730.   width:100%;
  731.   height:100%;
  732.   box-sizing:border-box;
  733.   transition:all 0.3s;
  734.   -webkit-transition:all 0.3s;
  735.   font-weight:500;
  736. }
  737.  
  738. .erinyen .tp-thumb.selected .tp-thumb-more:before,
  739. .erinyen .tp-thumb:hover .tp-thumb-more:before {
  740.  color:#aaa;
  741.  
  742. }
  743.  
  744. .erinyen .tp-thumb.selected .tp-thumb-over,
  745. .erinyen .tp-thumb:hover .tp-thumb-over {
  746.  background:#fff;
  747. }
  748. .erinyen .tp-thumb.selected .tp-thumb-title,
  749. .erinyen .tp-thumb:hover .tp-thumb-title {
  750.   color:#000;
  751.  
  752. }
  753.  
  754.  
  755. /* TABS */
  756. .erinyen .tp-tab-title {
  757.     color:#a8d8ee;
  758.     font-size:13px;
  759.     font-weight:700;
  760.     text-transform:uppercase;
  761.     font-family:"Roboto Slab"
  762.     margin-bottom:5px;
  763. }
  764.  
  765. .erinyen .tp-tab-desc {
  766.     font-size:18px;
  767.     font-weight:400;
  768.     color:#fff;
  769.     line-height:25px;
  770.     font-family:"Roboto Slab";
  771. }
  772.      
  773.  
  774. /*-----------------------------------------------------------------------------
  775.  
  776. - Revolution Slider 5.0 Navigatin Skin Style  -
  777.  
  778.  GYGES SKIN
  779.  
  780. author:  ThemePunch
  781. email:      info@themepunch.com
  782. website:    http://www.themepunch.com
  783. -----------------------------------------------------------------------------*/
  784. /* ARROWS */
  785.  
  786.  
  787. /* BULLETS */
  788. .gyges.tp-bullets {
  789. }
  790. .gyges.tp-bullets:before {
  791.     content:" ";
  792.     position:absolute;
  793.     width:100%;
  794.     height:100%;
  795.     background: #777777; /* Old browsers */
  796.     background: -moz-linear-gradient(top,  #777777 0%, #666666 100%);
  797.     background: -webkit-gradient(linear, left top, left bottom,
  798.     color-stop(0%,#777777), color-stop(100%,#666666));
  799.     background: -webkit-linear-gradient(top,  #777777 0%,#666666 100%);
  800.     background: -o-linear-gradient(top,  #777777 0%,#666666 100%);
  801.     background: -ms-linear-gradient(top,  #777777 0%,#666666 100%);
  802.     background: linear-gradient(to bottom,  #777777 0%,#666666 100%);
  803.     filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#777777",
  804.     endColorstr="#666666",GradientType=0 );
  805.     padding:10px;
  806.     margin-left:-10px;margin-top:-10px;
  807.     box-sizing:content-box;
  808.   border-radius:10px;
  809. }
  810. .gyges .tp-bullet {
  811.     width:12px;
  812.     height:12px;
  813.     position:absolute;
  814.     background:#333;
  815.     border:3px solid #444;
  816.     border-radius:50%;
  817.     cursor: pointer;
  818.     box-sizing:content-box;
  819. }
  820. .gyges .tp-bullet:hover,
  821. .gyges .tp-bullet.selected {
  822.     background: #ffffff; /* Old browsers */
  823.     background: -moz-linear-gradient(top,  #ffffff 0%, #e1e1e1 100%); /* FF3.6+ */
  824.     background: -webkit-gradient(linear, left top, left bottom,
  825.     color-stop(0%,#ffffff), color-stop(100%,#e1e1e1)); /* Chrome,Safari4+ */
  826.     background: -webkit-linear-gradient(top,  #ffffff 0%,#e1e1e1 100%); /* Chrome10+,Safari5.1+ */
  827.     background: -o-linear-gradient(top,  #ffffff 0%,#e1e1e1 100%); /* Opera 11.10+ */
  828.     background: -ms-linear-gradient(top,  #ffffff 0%,#e1e1e1 100%); /* IE10+ */
  829.     background: linear-gradient(to bottom,  #ffffff 0%,#e1e1e1 100%); /* W3C */
  830.     filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#ffffff",
  831.     endColorstr="#e1e1e1",GradientType=0 ); /* IE6-9 */
  832.  
  833. }
  834. .gyges .tp-bullet-image {
  835. }
  836. .gyges .tp-bullet-title {
  837. }
  838.    
  839.  
  840. /* THUMBS */
  841. .gyges .tp-thumb {
  842.       opacity:1
  843.   }
  844. .gyges .tp-thumb-img-wrap {
  845.   padding:3px;
  846.     background:#000;
  847.   background-color:rgba(0,0,0,0.25);
  848.   display:inline-block;
  849.  
  850.   width:100%;
  851.   height:100%;
  852.   position:relative;
  853.   margin:0px;
  854.   box-sizing:border-box;
  855.     transition:all 0.3s;
  856.     -webkit-transition:all 0.3s;
  857. }
  858. .gyges .tp-thumb-image {
  859.    padding:3px;
  860.    display:block;
  861.    box-sizing:border-box;
  862.    position:relative;
  863.     -webkit-box-shadow: inset 5px 5px 10px 0px rgba(0,0,0,0.25);
  864.   -moz-box-shadow: inset 5px 5px 10px 0px rgba(0,0,0,0.25);
  865.   box-shadow: inset 5px 5px 10px 0px rgba(0,0,0,0.25);
  866.  }  
  867. .gyges .tp-thumb-title {
  868.      position:absolute;
  869.      bottom:100%;
  870.      display:inline-block;
  871.      left:50%;
  872.      background:rgba(255,255,255,0.8);
  873.      padding:10px 30px;
  874.      border-radius:4px;
  875.      -webkit-border-radius:4px;
  876.      margin-bottom:20px;
  877.      opacity:0;
  878.       transition:all 0.3s;
  879.     -webkit-transition:all 0.3s;
  880.     transform: translateZ(0.001px) translateX(-50%) translateY(14px);
  881.     transform-origin:50% 100%;
  882.     -webkit-transform: translateZ(0.001px) translateX(-50%) translateY(14px);
  883.     -webkit-transform-origin:50% 100%;
  884.     white-space:nowrap;
  885.  }
  886. .gyges .tp-thumb:hover .tp-thumb-title {
  887.      transform:rotateX(0deg) translateX(-50%);
  888.     -webkit-transform:rotateX(0deg) translateX(-50%);
  889.     opacity:1;
  890. }
  891.  
  892. .gyges .tp-thumb:hover .tp-thumb-img-wrap,
  893.  .gyges .tp-thumb.selected .tp-thumb-img-wrap {
  894.  
  895.   background: rgba(255,255,255,1);
  896.   background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(119,119,119,1) 100%);
  897.   background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(255,255,255,1)), color-stop(100%, rgba(119,119,119,1)));
  898.   background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(119,119,119,1) 100%);
  899.   background: -o-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(119,119,119,1) 100%);
  900.   background: -ms-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(119,119,119,1) 100%);
  901.   background: linear-gradient(to bottom, rgba(255,255,255,1) 0%, rgba(119,119,119,1) 100%);
  902.   filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#ffffff", endColorstr="#777777", GradientType=0 );
  903.  }
  904. .gyges .tp-thumb-title:after {
  905.         content:" ";
  906.         position:absolute;
  907.         left:50%;
  908.         margin-left:-8px;
  909.         width: 0;
  910.         height: 0;
  911.         border-style: solid;
  912.         border-width: 8px 8px 0 8px;
  913.         border-color: rgba(255,255,255,0.8) transparent transparent transparent;
  914.         bottom:-8px;
  915.    }
  916.  
  917.  
  918. /* TABS */
  919. .gyges .tp-tab {
  920.   opacity:1;      
  921.   padding:10px;
  922.   box-sizing:border-box;
  923.   font-family: "Roboto", sans-serif;
  924.   border-bottom: 1px solid rgba(255,255,255,0.15);
  925.  }
  926. .gyges .tp-tab-image
  927. {
  928.   width:60px;
  929.   height:60px; max-height:100%; max-width:100%;
  930.   position:relative;
  931.   display:inline-block;
  932.   float:left;
  933.  
  934. }
  935. .gyges .tp-tab-content
  936. {
  937.     background:rgba(0,0,0,0);
  938.     position:relative;
  939.     padding:15px 15px 15px 85px;
  940.  left:0px;
  941.   overflow:hidden;
  942.  margin-top:-15px;
  943.     box-sizing:border-box;
  944.     color:#333;
  945.     display: inline-block;
  946.     width:100%;
  947.     height:100%;
  948.  position:absolute; }
  949. .gyges .tp-tab-date
  950.   {
  951.   display:block;
  952.   color: rgba(255,255,255,0.25);
  953.   font-weight:500;
  954.   font-size:12px;
  955.   margin-bottom:0px;
  956.   }
  957. .gyges .tp-tab-title
  958. {
  959.     display:block;  
  960.     text-align:left;
  961.     color:#fff;
  962.     font-size:14px;
  963.     font-weight:500;
  964.     text-transform:none;
  965.     line-height:17px;
  966. }
  967. .gyges .tp-tab:hover,
  968. .gyges .tp-tab.selected {
  969.   background:rgba(0,0,0,0.5);
  970. }
  971.  
  972. .gyges .tp-tab-mask {
  973. }
  974.  
  975. /* MEDIA QUERIES */
  976. @media only screen and (max-width: 960px) {
  977.  
  978. }
  979. @media only screen and (max-width: 768px) {
  980.  
  981. }
  982.  
  983. /*-----------------------------------------------------------------------------
  984.  
  985. - Revolution Slider 5.0 Navigatin Skin Style  -
  986.  
  987.  HADES SKIN
  988.  
  989. author:  ThemePunch
  990. email:      info@themepunch.com
  991. website:    http://www.themepunch.com
  992. -----------------------------------------------------------------------------*/
  993. /* ARROWS */
  994. .hades.tparrows {
  995.     cursor:pointer;
  996.     background:#000;
  997.     background:rgba(0,0,0,0.15);
  998.     width:100px;
  999.     height:100px;
  1000.     position:absolute;
  1001.     display:block;
  1002.     z-index:1000;
  1003. }
  1004.  
  1005. .hades.tparrows:before {
  1006.     font-family: "revicons";
  1007.     font-size:30px;
  1008.     color:#fff;
  1009.     display:block;
  1010.     line-height: 100px;
  1011.     text-align: center;
  1012.   transition: background 0.3s, color 0.3s;
  1013. }
  1014. .hades.tparrows.tp-leftarrow:before {
  1015.     content: "\e824";
  1016. }
  1017. .hades.tparrows.tp-rightarrow:before {
  1018.     content: "\e825";
  1019. }
  1020.  
  1021. .hades.tparrows:hover:before {
  1022.    color:#aaa;
  1023.    background:#fff;
  1024.    background:rgba(255,255,255,1);
  1025.  }
  1026. .hades .tp-arr-allwrapper {
  1027.   position:absolute;
  1028.   left:100%;
  1029.   top:0px;
  1030.   background:#888;
  1031.   width:100px;height:100px;
  1032.   -webkit-transition: all 0.3s;
  1033.   transition: all 0.3s;
  1034.   -ms-filter: "progid:dximagetransform.microsoft.alpha(opacity=0)";
  1035.   filter: alpha(opacity=0);
  1036.   -moz-opacity: 0.0;
  1037.   -khtml-opacity: 0.0;
  1038.   opacity: 0.0;
  1039.   -webkit-transform: rotatey(-90deg);
  1040.   transform: rotatey(-90deg);
  1041.   -webkit-transform-origin: 0% 50%;
  1042.   transform-origin: 0% 50%;
  1043. }
  1044. .hades.tp-rightarrow .tp-arr-allwrapper {
  1045.    left:auto;
  1046.    right:100%;
  1047.    -webkit-transform-origin: 100% 50%;
  1048.   transform-origin: 100% 50%;
  1049.    -webkit-transform: rotatey(90deg);
  1050.   transform: rotatey(90deg);
  1051. }
  1052.  
  1053. .hades:hover .tp-arr-allwrapper {
  1054.    -ms-filter: "progid:dximagetransform.microsoft.alpha(opacity=100)";
  1055.   filter: alpha(opacity=100);
  1056.   -moz-opacity: 1;
  1057.   -khtml-opacity: 1;
  1058.   opacity: 1;  
  1059.     -webkit-transform: rotatey(0deg);
  1060.   transform: rotatey(0deg);
  1061.  
  1062.  }
  1063.    
  1064. .hades .tp-arr-iwrapper {
  1065. }
  1066. .hades .tp-arr-imgholder {
  1067.   background-size:cover;
  1068.   position:absolute;
  1069.   top:0px;left:0px;
  1070.   width:100%;height:100%;
  1071. }
  1072. .hades .tp-arr-titleholder {
  1073. }
  1074. .hades .tp-arr-subtitleholder {
  1075. }
  1076.  
  1077.  
  1078. /* BULLETS */
  1079. .hades.tp-bullets {
  1080. }
  1081. .hades.tp-bullets:before {
  1082.     content:" ";
  1083.     position:absolute;
  1084.     width:100%;
  1085.     height:100%;
  1086.     background:transparent;
  1087.     padding:10px;
  1088.     margin-left:-10px;margin-top:-10px;
  1089.     box-sizing:content-box;
  1090. }
  1091. .hades .tp-bullet {
  1092.     width:3px;
  1093.     height:3px;
  1094.     position:absolute;
  1095.     background:#888;   
  1096.     cursor: pointer;
  1097.     border:5px solid #fff;
  1098.     box-sizing:content-box;
  1099.     box-shadow:0px 0px 3px 1px rgba(0,0,0,0.2);
  1100.     -webkit-perspective:400;
  1101.     perspective:400;
  1102.     -webkit-transform:translatez(0.01px);
  1103.     transform:translatez(0.01px);
  1104. }
  1105. .hades .tp-bullet:hover,
  1106. .hades .tp-bullet.selected {
  1107.     background:#555;
  1108.  
  1109. }
  1110.  
  1111. .hades .tp-bullet-image {
  1112.   position:absolute;top:-80px; left:-60px;width:120px;height:60px;
  1113.   background-position:center center;
  1114.   background-size:cover;
  1115.   visibility:hidden;
  1116.   opacity:0;
  1117.   transition:all 0.3s;
  1118.   -webkit-transform-style:flat;
  1119.   transform-style:flat;
  1120.   perspective:600;
  1121.   -webkit-perspective:600;
  1122.   transform: rotatex(-90deg);
  1123.   -webkit-transform: rotatex(-90deg);
  1124.   box-shadow:0px 0px 3px 1px rgba(0,0,0,0.2);
  1125.   transform-origin:50% 100%;
  1126.   -webkit-transform-origin:50% 100%;
  1127.  
  1128.  
  1129. }
  1130. .hades .tp-bullet:hover .tp-bullet-image {
  1131.   display:block;
  1132.   opacity:1;
  1133.   transform: rotatex(0deg);
  1134.   -webkit-transform: rotatex(0deg);
  1135.   visibility:visible;
  1136.     }
  1137. .hades .tp-bullet-title {
  1138. }
  1139.  
  1140.  
  1141. /* THUMBS */
  1142. .hades .tp-thumb {
  1143.       opacity:1
  1144.   }
  1145. .hades .tp-thumb-img-wrap {
  1146.   border-radius:50%;
  1147.   padding:3px;
  1148.   display:inline-block;
  1149. background:#000;
  1150.   background-color:rgba(0,0,0,0.25);
  1151.   width:100%;
  1152.   height:100%;
  1153.   position:relative;
  1154.   margin:0px;
  1155.   box-sizing:border-box;
  1156.     transition:all 0.3s;
  1157.     -webkit-transition:all 0.3s;
  1158. }
  1159. .hades .tp-thumb-image {
  1160.    padding:3px;
  1161.    border-radius:50%;
  1162.    display:block;
  1163.    box-sizing:border-box;
  1164.    position:relative;
  1165.     -webkit-box-shadow: inset 5px 5px 10px 0px rgba(0,0,0,0.25);
  1166.   -moz-box-shadow: inset 5px 5px 10px 0px rgba(0,0,0,0.25);
  1167.   box-shadow: inset 5px 5px 10px 0px rgba(0,0,0,0.25);
  1168.  }  
  1169.  
  1170.  
  1171. .hades .tp-thumb:hover .tp-thumb-img-wrap,
  1172. .hades .tp-thumb.selected .tp-thumb-img-wrap {
  1173.  
  1174.    background: rgba(255,255,255,1);
  1175.   background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(119,119,119,1) 100%);
  1176.   background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(255,255,255,1)), color-stop(100%, rgba(119,119,119,1)));
  1177.   background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(119,119,119,1) 100%);
  1178.   background: -o-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(119,119,119,1) 100%);
  1179.   background: -ms-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(119,119,119,1) 100%);
  1180.   background: linear-gradient(to bottom, rgba(255,255,255,1) 0%, rgba(119,119,119,1) 100%);
  1181.   filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#ffffff", endColorstr="#777777", GradientType=0 );
  1182.  
  1183.       }
  1184. .hades .tp-thumb-title:after {
  1185.         content:" ";
  1186.         position:absolute;
  1187.         left:50%;
  1188.         margin-left:-8px;
  1189.         width: 0;
  1190.         height: 0;
  1191.         border-style: solid;
  1192.         border-width: 8px 8px 0 8px;
  1193.         border-color: rgba(0,0,0,0.75) transparent transparent transparent;
  1194.         bottom:-8px;
  1195.    }
  1196.  
  1197.  
  1198. /* TABS */
  1199. .hades .tp-tab {
  1200.   opacity:1;
  1201.  }
  1202.    
  1203. .hades .tp-tab-title
  1204.  {
  1205.       display:block;
  1206.       color:#333;
  1207.       font-weight:600;
  1208.       font-size:18px;
  1209.       text-align:center;
  1210.       line-height:25px;      
  1211.     }
  1212. .hades .tp-tab-price
  1213.  {
  1214.     display:block;
  1215.     text-align:center;
  1216.     color:#999;
  1217.     font-size:16px;
  1218.     margin-top:10px;
  1219.    line-height:20px
  1220. }
  1221.  
  1222. .hades .tp-tab-button {
  1223.     display:inline-block;
  1224.     margin-top:15px;
  1225.     text-align:center;
  1226.     padding:5px 15px;
  1227.     color:#fff;
  1228.     font-size:14px;
  1229.     background:#219bd7;
  1230.     border-radius:4px;
  1231.    font-weight:400;
  1232. }
  1233. .hades .tp-tab-inner {
  1234.     text-align:center;
  1235. }
  1236.  
  1237.              
  1238.  
  1239. /*-----------------------------------------------------------------------------
  1240.  
  1241. - Revolution Slider 5.0 Navigatin Skin Style  -
  1242.  
  1243.  HEBE SKIN
  1244.  
  1245. author:  ThemePunch
  1246. email:      info@themepunch.com
  1247. website:    http://www.themepunch.com
  1248. -----------------------------------------------------------------------------*/
  1249. /* ARROWS */
  1250. .hebe.tparrows {
  1251.   cursor:pointer;
  1252.   background:#fff;
  1253.   min-width:70px;
  1254.     min-height:70px;
  1255.   position:absolute;
  1256.   display:block;
  1257.   z-index:1000;
  1258. }
  1259. .hebe.tparrows:hover {
  1260. }
  1261. .hebe.tparrows:before {
  1262.   font-family: "revicons";
  1263.   font-size:30px;
  1264.   color:#aaa;
  1265.   display:block;
  1266.   line-height: 70px;
  1267.   text-align: center;
  1268.   -webkit-transition: color 0.3s;
  1269.   -moz-transition: color 0.3s;
  1270.   transition: color 0.3s;
  1271.   z-index:2;
  1272.   position:relative;
  1273.    background:#fff;
  1274.   min-width:70px;
  1275.     min-height:70px;
  1276. }
  1277. .hebe.tparrows.tp-leftarrow:before {
  1278.   content: "\e824";
  1279. }
  1280. .hebe.tparrows.tp-rightarrow:before {
  1281.   content: "\e825";
  1282. }
  1283. .hebe.tparrows:hover:before {
  1284.  color:#000;
  1285.       }
  1286. .hebe .tp-title-wrap {
  1287.   position:absolute;
  1288.   z-index:0;
  1289.   display:inline-block;
  1290.   background:#000;
  1291.   background:rgba(0,0,0,0.75);
  1292.   min-height:60px;
  1293.   line-height:60px;
  1294.   top:-10px;
  1295.   margin-left:0px;
  1296.   -webkit-transition: -webkit-transform 0.3s;
  1297.   transition: transform 0.3s;
  1298.   transform:scaleX(0);  
  1299.   -webkit-transform:scaleX(0);  
  1300.   transform-origin:0% 50%;
  1301.    -webkit-transform-origin:0% 50%;
  1302. }
  1303.  .hebe.tp-rightarrow .tp-title-wrap {
  1304.    right:0px;
  1305.    -webkit-transform-origin:100% 50%;
  1306.  }
  1307. .hebe.tparrows:hover .tp-title-wrap {
  1308.   transform:scaleX(1);
  1309.   -webkit-transform:scaleX(1);
  1310. }
  1311. .hebe .tp-arr-titleholder {
  1312.   position:relative;
  1313.   text-transform:uppercase;
  1314.   color:#fff;
  1315.   font-weight:600;
  1316.   font-size:12px;
  1317.   line-height:90px;
  1318.   white-space:nowrap;
  1319.   padding:0px 20px 0px 90px;
  1320. }
  1321.  
  1322. .hebe.tp-rightarrow .tp-arr-titleholder {
  1323.    margin-left:0px;
  1324.    padding:0px 90px 0px 20px;
  1325.  }
  1326.  
  1327. .hebe.tparrows:hover .tp-arr-titleholder {
  1328.    transform:translateX(0px);
  1329.    -webkit-transform:translateX(0px);
  1330.   transition-delay: 0.1s;
  1331.   opacity:1;
  1332. }
  1333.  
  1334. .hebe .tp-arr-imgholder{
  1335.       width:90px;
  1336.       height:90px;
  1337.       position:absolute;
  1338.       left:100%;
  1339.       display:block;
  1340.       background-size:cover;
  1341.       background-position:center center;
  1342.      top:0px; right:-90px;
  1343.     }
  1344. .hebe.tp-rightarrow .tp-arr-imgholder{
  1345.         right:auto;left:-90px;
  1346.       }
  1347.  
  1348. /* BULLETS */
  1349. .hebe.tp-bullets {
  1350. }
  1351. .hebe.tp-bullets:before {
  1352.   content:" ";
  1353.   position:absolute;
  1354.   width:100%;
  1355.   height:100%;
  1356.   background:transparent;
  1357.   padding:10px;
  1358.   margin-left:-10px;margin-top:-10px;
  1359.   box-sizing:content-box;
  1360. }
  1361.  
  1362. .hebe .tp-bullet {
  1363.   width:3px;
  1364.   height:3px;
  1365.   position:absolute;
  1366.   background:#fff;  
  1367.   cursor: pointer;
  1368.   border:5px solid #222;
  1369.   border-radius:50%;
  1370.   box-sizing:content-box;
  1371.   -webkit-perspective:400;
  1372.   perspective:400;
  1373.   -webkit-transform:translateZ(0.01px);
  1374.   transform:translateZ(0.01px);
  1375.    transition:all 0.3s;
  1376. }
  1377. .hebe .tp-bullet:hover,
  1378. .hebe .tp-bullet.selected {
  1379.   background:#222;
  1380.   border-color:#fff;
  1381. }
  1382.  
  1383. .hebe .tp-bullet-image {
  1384.   position:absolute;
  1385.   top:-90px; left:-40px;
  1386.   width:70px;
  1387.   height:70px;
  1388.   background-position:center center;
  1389.   background-size:cover;
  1390.   visibility:hidden;
  1391.   opacity:0;
  1392.   transition:all 0.3s;
  1393.   -webkit-transform-style:flat;
  1394.   transform-style:flat;
  1395.   perspective:600;
  1396.   -webkit-perspective:600;
  1397.   transform: scale(0);
  1398.   -webkit-transform: scale(0);
  1399.   transform-origin:50% 100%;
  1400.   -webkit-transform-origin:50% 100%;
  1401. border-radius:6px;
  1402.  
  1403.  
  1404. }
  1405. .hebe .tp-bullet:hover .tp-bullet-image {
  1406.   display:block;
  1407.   opacity:1;
  1408.   transform: scale(1);
  1409.   -webkit-transform: scale(1);
  1410.   visibility:visible;
  1411.     }
  1412. .hebe .tp-bullet-title {
  1413. }
  1414.  
  1415.  
  1416. /* TABS */
  1417. .hebe .tp-tab-title {
  1418.     color:#a8d8ee;
  1419.     font-size:13px;
  1420.     font-weight:700;
  1421.     text-transform:uppercase;
  1422.     font-family:"Roboto Slab"
  1423.     margin-bottom:5px;
  1424. }
  1425.  
  1426. .hebe .tp-tab-desc {
  1427.     font-size:18px;
  1428.     font-weight:400;
  1429.     color:#fff;
  1430.     line-height:25px;
  1431.     font-family:"Roboto Slab";
  1432. }
  1433.  
  1434.  
  1435. /*-----------------------------------------------------------------------------
  1436.  
  1437. - Revolution Slider 5.0 Navigatin Skin Style  -
  1438.  
  1439.  HEPHAISTOS SKIN
  1440.  
  1441. author:  ThemePunch
  1442. email:      info@themepunch.com
  1443. website:    http://www.themepunch.com
  1444. -----------------------------------------------------------------------------*/
  1445. /* ARROWS */
  1446. .hephaistos.tparrows {
  1447.     cursor:pointer;
  1448.     background:#000;
  1449.     background:rgba(0,0,0,0.5);
  1450.     width:40px;
  1451.     height:40px;
  1452.     position:absolute;
  1453.     display:block;
  1454.     z-index:1000;
  1455.     border-radius:50%;
  1456. }
  1457. .hephaistos.tparrows:hover {
  1458.     background:#000;
  1459. }
  1460. .hephaistos.tparrows:before {
  1461.     font-family: "revicons";
  1462.     font-size:18px;
  1463.     color:#fff;
  1464.     display:block;
  1465.     line-height: 40px;
  1466.     text-align: center;
  1467. }
  1468. .hephaistos.tparrows.tp-leftarrow:before {
  1469.     content: "\e82c";
  1470.   margin-left:-2px;
  1471.  
  1472. }
  1473. .hephaistos.tparrows.tp-rightarrow:before {
  1474.     content: "\e82d";
  1475.    margin-right:-2px;
  1476. }
  1477.  
  1478.  
  1479.  
  1480. /* BULLETS */
  1481. .hephaistos.tp-bullets {
  1482. }
  1483. .hephaistos.tp-bullets:before {
  1484.     content:" ";
  1485.     position:absolute;
  1486.     width:100%;
  1487.     height:100%;
  1488.     background:transparent;
  1489.     padding:10px;
  1490.     margin-left:-10px;margin-top:-10px;
  1491.     box-sizing:content-box;
  1492. }
  1493. .hephaistos .tp-bullet {
  1494.     width:12px;
  1495.     height:12px;
  1496.     position:absolute;
  1497.     background:#999;
  1498.     border:3px solid #f5f5f5;
  1499.     border-radius:50%;
  1500.     cursor: pointer;
  1501.     box-sizing:content-box;
  1502.   box-shadow: 0px 0px 2px 1px rgba(130,130,130, 0.3);
  1503.  
  1504. }
  1505. .hephaistos .tp-bullet:hover,
  1506. .hephaistos .tp-bullet.selected {
  1507.     background:#fff;
  1508.     border-color:#000;
  1509. }
  1510. .hephaistos .tp-bullet-image {
  1511. }
  1512. .hephaistos .tp-bullet-title {
  1513. }
  1514.  
  1515.  
  1516. /*-----------------------------------------------------------------------------
  1517.  
  1518. - Revolution Slider 5.0 Navigatin Skin Style  -
  1519.  
  1520.  HERMES SKIN
  1521.  
  1522. author:  ThemePunch
  1523. email:      info@themepunch.com
  1524. website:    http://www.themepunch.com
  1525. -----------------------------------------------------------------------------*/
  1526. /* ARROWS */
  1527. .hermes.tparrows {
  1528.     cursor:pointer;
  1529.     background:#000;
  1530.     background:rgba(0,0,0,0.5);
  1531.     width:30px;
  1532.     height:110px;
  1533.     position:absolute;
  1534.     display:block;
  1535.     z-index:1000;
  1536. }
  1537.  
  1538. .hermes.tparrows:before {
  1539.     font-family: "revicons";
  1540.     font-size:15px;
  1541.     color:#fff;
  1542.     display:block;
  1543.     line-height: 110px;
  1544.     text-align: center;
  1545.     transform:translateX(0px);
  1546.     -webkit-transform:translateX(0px);
  1547.     transition:all 0.3s;
  1548.     -webkit-transition:all 0.3s;
  1549. }
  1550. .hermes.tparrows.tp-leftarrow:before {
  1551.     content: "\e824";
  1552. }
  1553. .hermes.tparrows.tp-rightarrow:before {
  1554.     content: "\e825";
  1555. }
  1556. .hermes.tparrows.tp-leftarrow:hover:before {
  1557.     transform:translateX(-20px);
  1558.     -webkit-transform:translateX(-20px);
  1559.      opacity:0;
  1560. }
  1561. .hermes.tparrows.tp-rightarrow:hover:before {
  1562.     transform:translateX(20px);
  1563.     -webkit-transform:translateX(20px);
  1564.      opacity:0;
  1565. }
  1566.  
  1567. .hermes .tp-arr-allwrapper {
  1568.     overflow:hidden;
  1569.     position:absolute;
  1570.     width:180px;
  1571.     height:140px;
  1572.     top:0px;
  1573.     left:0px;
  1574.     visibility:hidden;
  1575.       -webkit-transition: -webkit-transform 0.3s 0.3s;
  1576.   transition: transform 0.3s 0.3s;
  1577.   -webkit-perspective: 1000px;
  1578.   perspective: 1000px;
  1579.     }
  1580. .hermes.tp-rightarrow .tp-arr-allwrapper {
  1581.    right:0px;left:auto;
  1582.       }
  1583. .hermes.tparrows:hover .tp-arr-allwrapper {
  1584.    visibility:visible;
  1585.           }
  1586. .hermes .tp-arr-imgholder {
  1587.   width:180px;position:absolute;
  1588.   left:0px;top:0px;height:110px;
  1589.   transform:translateX(-180px);
  1590.   -webkit-transform:translateX(-180px);
  1591.   transition:all 0.3s;
  1592.   transition-delay:0.3s;
  1593. }
  1594. .hermes.tp-rightarrow .tp-arr-imgholder{
  1595.     transform:translateX(180px);
  1596.   -webkit-transform:translateX(180px);
  1597.       }
  1598.  
  1599. .hermes.tparrows:hover .tp-arr-imgholder {
  1600.    transform:translateX(0px);
  1601.    -webkit-transform:translateX(0px);            
  1602. }
  1603. .hermes .tp-arr-titleholder {
  1604.   top:110px;
  1605.   width:180px;
  1606.   text-align:left;
  1607.   display:block;
  1608.   padding:0px 10px;
  1609.   line-height:30px; background:#000;
  1610.   background:rgba(0,0,0,0.75);color:#fff;
  1611.   font-weight:600; position:absolute;
  1612.   font-size:12px;
  1613.   white-space:nowrap;
  1614.   letter-spacing:1px;
  1615.   -webkit-transition: all 0.3s;
  1616.   transition: all 0.3s;
  1617.   -webkit-transform: rotateX(-90deg);
  1618.   transform: rotateX(-90deg);
  1619.   -webkit-transform-origin: 50% 0;
  1620.   transform-origin: 50% 0;
  1621.   box-sizing:border-box;
  1622.  
  1623. }
  1624. .hermes.tparrows:hover .tp-arr-titleholder {
  1625.     -webkit-transition-delay: 0.6s;
  1626.   transition-delay: 0.6s;
  1627.   -webkit-transform: rotateX(0deg);
  1628.   transform: rotateX(0deg);
  1629. }
  1630.  
  1631.  
  1632. /* BULLETS */
  1633. .hermes.tp-bullets {
  1634. }
  1635.  
  1636. .hermes .tp-bullet {
  1637.     overflow:hidden;
  1638.     border-radius:50%;
  1639.     width:16px;
  1640.     height:16px;
  1641.     background-color: rgba(0, 0, 0, 0);
  1642.     box-shadow: inset 0 0 0 2px #FFF;
  1643.     -webkit-transition: background 0.3s ease;
  1644.     transition: background 0.3s ease;
  1645.     position:absolute;
  1646. }
  1647.  
  1648. .hermes .tp-bullet:hover {
  1649.       background-color: rgba(0, 0, 0, 0.2);
  1650. }
  1651. .hermes .tp-bullet:after {
  1652.   content: ' ';
  1653.   position: absolute;
  1654.   bottom: 0;
  1655.   height: 0;
  1656.   left: 0;
  1657.   width: 100%;
  1658.   background-color: #FFF;
  1659.   box-shadow: 0 0 1px #FFF;
  1660.   -webkit-transition: height 0.3s ease;
  1661.   transition: height 0.3s ease;
  1662. }
  1663. .hermes .tp-bullet.selected:after {
  1664.   height:100%;
  1665. }
  1666.  
  1667.  
  1668. /* TABS */
  1669. .hermes .tp-tab {
  1670.   opacity:1;  
  1671.   padding-right:10px;
  1672.   box-sizing:border-box;
  1673.  }
  1674. .hermes .tp-tab-image
  1675. {
  1676.   width:100%;
  1677.   height:60%;
  1678.   position:relative;
  1679. }
  1680. .hermes .tp-tab-content
  1681. {
  1682.     background:rgb(54,54,54);
  1683.     position:absolute;
  1684.     padding:20px 20px 20px 30px;
  1685.     box-sizing:border-box;
  1686.     color:#fff;
  1687.   display:block;
  1688.   width:100%;
  1689.   min-height:40%;
  1690.   bottom:0px;
  1691.   left:-10px;
  1692.   }
  1693. .hermes .tp-tab-date
  1694.   {
  1695.   display:block;
  1696.   color:#888;
  1697.   font-weight:600;
  1698.   font-size:12px;
  1699.   margin-bottom:10px;
  1700.   }
  1701. .hermes .tp-tab-title
  1702. {
  1703.     display:block; 
  1704.     color:#fff;
  1705.     font-size:16px;
  1706.     font-weight:800;
  1707.     text-transform:uppercase;
  1708.    line-height:19px;
  1709. }
  1710.  
  1711. .hermes .tp-tab.selected .tp-tab-title:after {
  1712.     width: 0px;
  1713.     height: 0px;
  1714.     border-style: solid;
  1715.     border-width: 30px 0 30px 10px;
  1716.     border-color: transparent transparent transparent rgb(54,54,54);
  1717.     content:" ";
  1718.     position:absolute;
  1719.     right:-9px;
  1720.     bottom:50%;
  1721.     margin-bottom:-30px;
  1722. }
  1723. .hermes .tp-tab-mask {
  1724.      padding-right:10px !important;
  1725.           }
  1726.  
  1727. /* MEDIA QUERIES */
  1728. @media only screen and (max-width: 960px) {
  1729.   .hermes .tp-tab .tp-tab-title {font-size:14px;line-height:16px;}
  1730.   .hermes .tp-tab-date { font-size:11px; line-height:13px;margin-bottom:10px;}
  1731.   .hermes .tp-tab-content { padding:15px 15px 15px 25px;}
  1732. }
  1733. @media only screen and (max-width: 768px) {
  1734.   .hermes .tp-tab .tp-tab-title {font-size:12px;line-height:14px;}
  1735.   .hermes .tp-tab-date {font-size:10px; line-height:12px;margin-bottom:5px;}
  1736.   .hermes .tp-tab-content {padding:10px 10px 10px 20px;}
  1737. }
  1738.  
  1739. /*-----------------------------------------------------------------------------
  1740.  
  1741. - Revolution Slider 5.0 Navigatin Skin Style  -
  1742.  
  1743.  HESPERIDEN SKIN
  1744.  
  1745. author:  ThemePunch
  1746. email:      info@themepunch.com
  1747. website:    http://www.themepunch.com
  1748. -----------------------------------------------------------------------------*/
  1749. /* ARROWS */
  1750. .hesperiden.tparrows {
  1751.     cursor:pointer;
  1752.     background:#000;
  1753.     background:rgba(0,0,0,0.5);
  1754.     width:40px;
  1755.     height:40px;
  1756.     position:absolute;
  1757.     display:block;
  1758.     z-index:1000;
  1759.     border-radius: 50%;
  1760. }
  1761. .hesperiden.tparrows:hover {
  1762.     background:#000;
  1763. }
  1764. .hesperiden.tparrows:before {
  1765.     font-family: "revicons";
  1766.     font-size:20px;
  1767.     color:#fff;
  1768.     display:block;
  1769.     line-height: 40px;
  1770.     text-align: center;
  1771. }
  1772. .hesperiden.tparrows.tp-leftarrow:before {
  1773.     content: "\e82c";
  1774.     margin-left:-3px;
  1775. }
  1776. .hesperiden.tparrows.tp-rightarrow:before {
  1777.     content: "\e82d";
  1778.     margin-right:-3px;
  1779. }
  1780.  
  1781. /* BULLETS */
  1782. .hesperiden.tp-bullets {
  1783. }
  1784. .hesperiden.tp-bullets:before {
  1785.     content:" ";
  1786.     position:absolute;
  1787.     width:100%;
  1788.     height:100%;
  1789.     background:transparent;
  1790.     padding:10px;
  1791.     margin-left:-10px;margin-top:-10px;
  1792.     box-sizing:content-box;
  1793.    border-radius:8px;
  1794.  
  1795. }
  1796. .hesperiden .tp-bullet {
  1797.     width:12px;
  1798.     height:12px;
  1799.     position:absolute;
  1800.     background: #999999; /* old browsers */
  1801.     background: -moz-linear-gradient(top,  #999999 0%, #e1e1e1 100%); /* ff3.6+ */
  1802.     background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#999999),
  1803.     color-stop(100%,#e1e1e1)); /* chrome,safari4+ */
  1804.     background: -webkit-linear-gradient(top,  #999999 0%,#e1e1e1 100%); /* chrome10+,safari5.1+ */
  1805.     background: -o-linear-gradient(top,  #999999 0%,#e1e1e1 100%); /* opera 11.10+ */
  1806.     background: -ms-linear-gradient(top,  #999999 0%,#e1e1e1 100%); /* ie10+ */
  1807.     background: linear-gradient(to bottom,  #999999 0%,#e1e1e1 100%); /* w3c */
  1808.     filter: progid:dximagetransform.microsoft.gradient(
  1809.     startcolorstr="#999999", endcolorstr="#e1e1e1",gradienttype=0 ); /* ie6-9 */
  1810.     border:3px solid #e5e5e5;
  1811.     border-radius:50%;
  1812.     cursor: pointer;
  1813.     box-sizing:content-box;
  1814. }
  1815. .hesperiden .tp-bullet:hover,
  1816. .hesperiden .tp-bullet.selected {
  1817.     background:#666;
  1818. }
  1819. .hesperiden .tp-bullet-image {
  1820. }
  1821. .hesperiden .tp-bullet-title {
  1822. }
  1823.  
  1824.  
  1825. /* THUMBS */
  1826. .hesperiden .tp-thumb {
  1827.   opacity:1;
  1828.   -webkit-perspective: 600px;
  1829.   perspective: 600px;
  1830. }
  1831. .hesperiden .tp-thumb .tp-thumb-title {
  1832.     font-size:12px;
  1833.     position:absolute;
  1834.     margin-top:-10px;
  1835.     color:#fff;
  1836.     display:block;
  1837.     z-index:10000;
  1838.     background-color:#000;
  1839.     padding:5px 10px;
  1840.     bottom:0px;
  1841.     left:0px;
  1842.     width:100%;
  1843.   box-sizing:border-box;
  1844.     text-align:center;
  1845.     overflow:hidden;
  1846.     white-space:nowrap;
  1847.     transition:all 0.3s;
  1848.     -webkit-transition:all 0.3s;
  1849.     transform:rotatex(90deg) translatez(0.001px);
  1850.     transform-origin:50% 100%;
  1851.     -webkit-transform:rotatex(90deg) translatez(0.001px);
  1852.     -webkit-transform-origin:50% 100%;
  1853.     opacity:0;
  1854.  }
  1855. .hesperiden .tp-thumb:hover .tp-thumb-title {
  1856.      transform:rotatex(0deg);
  1857.     -webkit-transform:rotatex(0deg);
  1858.     opacity:1;
  1859. }
  1860.  
  1861. /* TABS */
  1862. .hesperiden .tp-tab {
  1863.   opacity:1;      
  1864.   padding:10px;
  1865.   box-sizing:border-box;
  1866.   font-family: "Roboto", sans-serif;
  1867.   border-bottom: 1px solid #e5e5e5;
  1868.  }
  1869. .hesperiden .tp-tab-image
  1870. {
  1871.   width:60px;
  1872.   height:60px; max-height:100%; max-width:100%;
  1873.   position:relative;
  1874.   display:inline-block;
  1875.   float:left;
  1876.  
  1877. }
  1878. .hesperiden .tp-tab-content
  1879. {
  1880.     background:rgba(0,0,0,0);
  1881.     position:relative;
  1882.     padding:15px 15px 15px 85px;
  1883.  left:0px;
  1884.  overflow:hidden;
  1885.  margin-top:-15px;
  1886.     box-sizing:border-box;
  1887.     color:#333;
  1888.     display: inline-block;
  1889.     width:100%;
  1890.     height:100%;
  1891.  position:absolute; }
  1892. .hesperiden .tp-tab-date
  1893.   {
  1894.   display:block;
  1895.   color: #aaa;
  1896.   font-weight:500;
  1897.   font-size:12px;
  1898.   margin-bottom:0px;
  1899.   }
  1900. .hesperiden .tp-tab-title
  1901. {
  1902.     display:block; 
  1903.     text-align:left;
  1904.     color:#333;
  1905.     font-size:14px;
  1906.     font-weight:500;
  1907.     text-transform:none;
  1908.     line-height:17px;
  1909. }
  1910. .hesperiden .tp-tab:hover,
  1911. .hesperiden .tp-tab.selected {
  1912.     background:#eee;
  1913. }
  1914.  
  1915. .hesperiden .tp-tab-mask {
  1916. }
  1917.  
  1918. /* MEDIA QUERIES */
  1919. @media only screen and (max-width: 960px) {
  1920.  
  1921. }
  1922. @media only screen and (max-width: 768px) {
  1923.  
  1924. }
  1925.  
  1926. /*-----------------------------------------------------------------------------
  1927.  
  1928. - Revolution Slider 5.0 Navigatin Skin Style  -
  1929.  
  1930.  METIS SKIN
  1931.  
  1932. author:  ThemePunch
  1933. email:      info@themepunch.com
  1934. website:    http://www.themepunch.com
  1935. -----------------------------------------------------------------------------*/
  1936. /* ARROWS */
  1937. .metis.tparrows {
  1938.   background:#fff;
  1939.   padding:10px;
  1940.   transition:all 0.3s;
  1941.   -webkit-transition:all 0.3s;
  1942.   width:60px;
  1943.   height:60px;
  1944.   box-sizing:border-box;
  1945.  }
  1946.  
  1947.  .metis.tparrows:hover {
  1948.    background:#fff;
  1949.    background:rgba(255,255,255,0.75);
  1950.  }
  1951.  
  1952.  .metis.tparrows:before {
  1953.   color:#000;  
  1954.    transition:all 0.3s;
  1955.   -webkit-transition:all 0.3s;
  1956.  }
  1957.  
  1958.  .metis.tparrows:hover:before {
  1959.    transform:scale(1.5);
  1960.   }
  1961.  
  1962.  
  1963. /* BULLETS */
  1964. .metis .tp-bullet {
  1965.     opacity:1;
  1966.     width:50px;
  1967.     height:50px;    
  1968.     padding:3px;
  1969.     background:#000;
  1970.     background-color:rgba(0,0,0,0.25);
  1971.     margin:0px;
  1972.     box-sizing:border-box;
  1973.     transition:all 0.3s;
  1974.     -webkit-transition:all 0.3s;
  1975.     border-radius:50%;
  1976.   }
  1977.  
  1978. .metis .tp-bullet-image {
  1979.  
  1980.    border-radius:50%;
  1981.    display:block;
  1982.    box-sizing:border-box;
  1983.    position:relative;
  1984.     -webkit-box-shadow: inset 5px 5px 10px 0px rgba(0,0,0,0.25);
  1985.   -moz-box-shadow: inset 5px 5px 10px 0px rgba(0,0,0,0.25);
  1986.   box-shadow: inset 5px 5px 10px 0px rgba(0,0,0,0.25);
  1987.   width:44px;
  1988.   height:44px;
  1989.   background-size:cover;
  1990.   background-position:center center;
  1991.  }  
  1992. .metis .tp-bullet-title {
  1993.      position:absolute;
  1994.      bottom:65px;
  1995.      display:inline-block;
  1996.      left:50%;
  1997.      background:#000;
  1998.      background:rgba(0,0,0,0.75);
  1999.      color:#fff;
  2000.      padding:10px 30px;
  2001.      border-radius:4px;
  2002.      -webkit-border-radius:4px;
  2003.      opacity:0;
  2004.       transition:all 0.3s;
  2005.     -webkit-transition:all 0.3s;
  2006.     transform: translateZ(0.001px) translateX(-50%) translateY(14px);
  2007.     transform-origin:50% 100%;
  2008.     -webkit-transform: translateZ(0.001px) translateX(-50%) translateY(14px);
  2009.     -webkit-transform-origin:50% 100%;
  2010.     opacity:0;
  2011.     white-space:nowrap;
  2012.  }
  2013.  
  2014. .metis .tp-bullet:hover .tp-bullet-title {
  2015.      transform:rotateX(0deg) translateX(-50%);
  2016.     -webkit-transform:rotateX(0deg) translateX(-50%);
  2017.     opacity:1;
  2018. }
  2019.  
  2020. .metis .tp-bullet.selected,
  2021. .metis .tp-bullet:hover  {
  2022.  
  2023.    background: rgba(255,255,255,1);
  2024.   background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(119,119,119,1) 100%);
  2025.   background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(255,255,255,1)), color-stop(100%, rgba(119,119,119,1)));
  2026.   background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(119,119,119,1) 100%);
  2027.   background: -o-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(119,119,119,1) 100%);
  2028.   background: -ms-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(119,119,119,1) 100%);
  2029.   background: linear-gradient(to bottom, rgba(255,255,255,1) 0%, rgba(119,119,119,1) 100%);
  2030.   filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#ffffff", endColorstr="#777777", GradientType=0 );
  2031.  
  2032.       }
  2033. .metis .tp-bullet-title:after {
  2034.         content:" ";
  2035.         position:absolute;
  2036.         left:50%;
  2037.         margin-left:-8px;
  2038.         width: 0;
  2039.         height: 0;
  2040.         border-style: solid;
  2041.         border-width: 8px 8px 0 8px;
  2042.         border-color: rgba(0,0,0,0.75) transparent transparent transparent;
  2043.         bottom:-8px;
  2044.    }
  2045.  
  2046. .metis .tp-tab-number {
  2047.         color: #fff;
  2048.         font-size: 40px;
  2049.         line-height: 30px;
  2050.         font-weight: 400;
  2051.         font-family: "Playfair Display";
  2052.         width: 50px;
  2053.         margin-right: 17px;
  2054.         display: inline-block;
  2055.         float: left;
  2056.     }
  2057.     .metis .tp-tab-mask {
  2058.         padding-left: 20px;
  2059.         left: 0px;
  2060.         max-width: 90px !important;
  2061.         transition: 0.4s padding-left, 0.4s left, 0.4s max-width;
  2062.     }
  2063.     .metis:hover .tp-tab-mask {
  2064.         padding-left: 0px;
  2065.         left: 50px;
  2066.         max-width: 500px !important;
  2067.     }
  2068.     .metis .tp-tab-divider {
  2069.         border-right: 1px solid transparent;
  2070.         height: 30px;
  2071.         width: 1px;
  2072.         margin-top: 5px;
  2073.         display: inline-block;
  2074.         float: left;
  2075.     }
  2076.     .metis .tp-tab-title {
  2077.         color: #fff;
  2078.         font-size: 20px;
  2079.         line-height: 20px;
  2080.         font-weight: 400;
  2081.         font-family: "Playfair Display";
  2082.         position: relative;
  2083.         padding-top: 10px;
  2084.         padding-left: 30px;
  2085.         display: inline-block;
  2086.         transform: translateX(-100%);
  2087.         transition: 0.4s all;
  2088.     }
  2089.     .metis .tp-tab-title-mask {
  2090.         position: absolute;
  2091.         overflow: hidden;
  2092.         left: 67px;
  2093.     }
  2094.     .metis:hover .tp-tab-title {
  2095.         transform: translateX(0);
  2096.     }
  2097.     .metis .tp-tab {
  2098.         opacity: 0.15;
  2099.         transition: 0.4s all;
  2100.     }
  2101.     .metis .tp-tab:hover,
  2102.     .metis .tp-tab.selected {
  2103.         opacity: 1;
  2104.     }
  2105.     .metis .tp-tab.selected .tp-tab-divider {
  2106.         border-right: 1px solid #cdb083;
  2107.     }
  2108.     .metis.tp-tabs {
  2109.         max-width: 118px !important;
  2110.         padding-left: 50px;
  2111.     }
  2112.     .metis.tp-tabs:before {
  2113.         content: " ";
  2114.         height: 100%;
  2115.         width: 88px;
  2116.         background: rgba(0, 0, 0, 0.15);
  2117.         border-right: 1px solid rgba(255, 255, 255, 0.10);
  2118.         left: 0px;
  2119.         top: 0px;
  2120.         position: absolute;
  2121.         transition: 0.4s all;
  2122.     }
  2123.     .metis.tp-tabs:hover:before {
  2124.         width: 118px;
  2125.     }
  2126.     @media (max-width: 499px) {
  2127.         .metis.tp-tabs:before {
  2128.             background: rgba(0, 0, 0, 0.75);
  2129.         }
  2130.     }
  2131.  
  2132. /*-----------------------------------------------------------------------------
  2133.  
  2134. - Revolution Slider 5.0 Navigatin Skin Style  -
  2135.  
  2136.  PERSEPHONE SKIN
  2137.  
  2138. author:  ThemePunch
  2139. email:      info@themepunch.com
  2140. website:    http://www.themepunch.com
  2141. -----------------------------------------------------------------------------*/
  2142. /* ARROWS */
  2143. .persephone.tparrows {
  2144.     cursor:pointer;
  2145.     background:#aaa;
  2146.     background:rgba(200,200,200,0.5);
  2147.     width:40px;
  2148.     height:40px;
  2149.     position:absolute;
  2150.     display:block;
  2151.     z-index:100;
  2152.   border:1px solid #f5f5f5;
  2153. }
  2154. .persephone.tparrows:hover {
  2155.     background:#333;
  2156. }
  2157. .persephone.tparrows:before {
  2158.     font-family: "revicons";
  2159.     font-size:15px;
  2160.     color:#fff;
  2161.     display:block;
  2162.     line-height: 40px;
  2163.     text-align: center;
  2164. }
  2165. .persephone.tparrows.tp-leftarrow:before {
  2166.     content: "\e824";
  2167. }
  2168. .persephone.tparrows.tp-rightarrow:before {
  2169.     content: "\e825";
  2170. }
  2171.  
  2172.  
  2173.  
  2174. /* BULLETS */
  2175. .persephone.tp-bullets {
  2176. }
  2177. .persephone.tp-bullets:before {
  2178.     content:" ";
  2179.     position:absolute;
  2180.     width:100%;
  2181.     height:100%;
  2182.     background:#transparent;
  2183.     padding:10px;
  2184.     margin-left:-10px;margin-top:-10px;
  2185.     box-sizing:content-box;
  2186. }
  2187. .persephone .tp-bullet {
  2188.     width:12px;
  2189.     height:12px;
  2190.     position:absolute;
  2191.     background:#aaa;
  2192.     border:1px solid #e5e5e5;  
  2193.     cursor: pointer;
  2194.     box-sizing:content-box;
  2195. }
  2196. .persephone .tp-bullet:hover,
  2197. .persephone .tp-bullet.selected {
  2198.     background:#222;
  2199. }
  2200. .persephone .tp-bullet-image {
  2201. }
  2202. .persephone .tp-bullet-title {
  2203. }
  2204.  
  2205.  
  2206. /*-----------------------------------------------------------------------------
  2207.  
  2208. - Revolution Slider 5.0 Navigatin Skin Style  -
  2209.  
  2210.  URANUS SKIN
  2211.  
  2212. author:  ThemePunch
  2213. email:      info@themepunch.com
  2214. website:    http://www.themepunch.com
  2215. -----------------------------------------------------------------------------*/
  2216. /* ARROWS */
  2217. .uranus.tparrows {
  2218.   width:50px;
  2219.   height:50px;
  2220.   background:transparent;
  2221.  }
  2222.  .uranus.tparrows:before {
  2223.  width:50px;
  2224.  height:50px;
  2225.  line-height:50px;
  2226.  font-size:40px;
  2227.  transition:all 0.3s;
  2228. -webkit-transition:all 0.3s;
  2229.  }
  2230.  
  2231.   .uranus.tparrows:hover:before {
  2232.     opacity:0.75;
  2233.   }
  2234.  
  2235. /* BULLETS */
  2236. .uranus .tp-bullet{
  2237.     border-radius: 50%;
  2238.   box-shadow: 0 0 0 2px rgba(255, 255, 255, 0);
  2239.   -webkit-transition: box-shadow 0.3s ease;
  2240.   transition: box-shadow 0.3s ease;
  2241.   background:transparent;
  2242. }
  2243. .uranus .tp-bullet.selected,
  2244. .uranus .tp-bullet:hover {
  2245.   box-shadow: 0 0 0 2px #FFF;
  2246.   border:none;
  2247.   border-radius: 50%;
  2248.  
  2249.    background:transparent;
  2250. }
  2251.  
  2252.  
  2253.  
  2254. .uranus .tp-bullet-inner {
  2255.   background-color: rgba(255, 255, 255, 0.7);
  2256.   -webkit-transition: background-color 0.3s ease, -webkit-transform 0.3s ease;
  2257.   transition: background-color 0.3s ease, transform 0.3s ease;
  2258.   top: 0;
  2259.   left: 0;
  2260.   width: 100%;
  2261.   height: 100%;
  2262.   outline: none;
  2263.   border-radius: 50%;
  2264.   background-color: #FFF;
  2265.   background-color: rgba(255, 255, 255, 0.3);
  2266.   text-indent: -999em;
  2267.   cursor: pointer;
  2268.   position: absolute;
  2269. }
  2270.  
  2271. .uranus .tp-bullet.selected .tp-bullet-inner,
  2272. .uranus .tp-bullet:hover .tp-bullet-inner{
  2273.  transform: scale(0.4);
  2274.  -webkit-transform: scale(0.4);
  2275.  background-color:#fff;
  2276. }
  2277.  
  2278. /*-----------------------------------------------------------------------------
  2279.  
  2280. - Revolution Slider 5.0 Navigatin Skin Style  -
  2281.  
  2282.  ZEUS SKIN
  2283.  
  2284. author:  ThemePunch
  2285. email:      info@themepunch.com
  2286. website:    http://www.themepunch.com
  2287. -----------------------------------------------------------------------------*/
  2288. /* ARROWS */
  2289. .zeus.tparrows {
  2290.   cursor:pointer;
  2291.   min-width:70px;
  2292.   min-height:70px;
  2293.   position:absolute;
  2294.   display:block;
  2295.   z-index:100;
  2296.   border-radius:35px;  
  2297.   overflow:hidden;
  2298.   background:rgba(0,0,0,0.10);
  2299. }
  2300.  
  2301. .zeus.tparrows:before {
  2302.   font-family: "revicons";
  2303.   font-size:20px;
  2304.   color:#fff;
  2305.   display:block;
  2306.   line-height: 70px;
  2307.   text-align: center;    
  2308.   z-index:2;
  2309.   position:relative;
  2310. }
  2311. .zeus.tparrows.tp-leftarrow:before {
  2312.   content: "\e824";
  2313. }
  2314. .zeus.tparrows.tp-rightarrow:before {
  2315.   content: "\e825";
  2316. }
  2317.  
  2318. .zeus .tp-title-wrap {
  2319.   background:#000;
  2320.   background:rgba(0,0,0,0.5);
  2321.   width:100%;
  2322.   height:100%;
  2323.   top:0px;
  2324.   left:0px;
  2325.   position:absolute;
  2326.   opacity:0;
  2327.   transform:scale(0);
  2328.   -webkit-transform:scale(0);
  2329.    transition: all 0.3s;
  2330.   -webkit-transition:all 0.3s;
  2331.   -moz-transition:all 0.3s;
  2332.    border-radius:50%;
  2333.  }
  2334. .zeus .tp-arr-imgholder {
  2335.   width:100%;
  2336.   height:100%;
  2337.   position:absolute;
  2338.   top:0px;
  2339.   left:0px;
  2340.   background-position:center center;
  2341.   background-size:cover;
  2342.   border-radius:50%;
  2343.   transform:translateX(-100%);
  2344.   -webkit-transform:translateX(-100%);
  2345.    transition: all 0.3s;
  2346.   -webkit-transition:all 0.3s;
  2347.   -moz-transition:all 0.3s;
  2348.  
  2349.  }
  2350. .zeus.tp-rightarrow .tp-arr-imgholder {
  2351.     transform:translateX(100%);
  2352.   -webkit-transform:translateX(100%);
  2353.       }
  2354. .zeus.tparrows:hover .tp-arr-imgholder {
  2355.   transform:translateX(0);
  2356.   -webkit-transform:translateX(0);
  2357.   opacity:1;
  2358. }
  2359.      
  2360. .zeus.tparrows:hover .tp-title-wrap {
  2361.   transform:scale(1);
  2362.   -webkit-transform:scale(1);
  2363.   opacity:1;
  2364. }
  2365.  
  2366.  
  2367. /* BULLETS */
  2368. .zeus .tp-bullet {
  2369.      box-sizing:content-box; -webkit-box-sizing:content-box; border-radius:50%;
  2370.       background-color: rgba(0, 0, 0, 0);
  2371.       -webkit-transition: opacity 0.3s ease;
  2372.       transition: opacity 0.3s ease;
  2373.       width:13px;height:13px;
  2374.       border:2px solid #fff;
  2375.  }
  2376. .zeus .tp-bullet:after {
  2377.   content: "";
  2378.   position: absolute;
  2379.   width: 100%;
  2380.   height: 100%;
  2381.   left: 0;
  2382.   border-radius: 50%;
  2383.   background-color: #FFF;
  2384.   -webkit-transform: scale(0);
  2385.   transform: scale(0);
  2386.   -webkit-transform-origin: 50% 50%;
  2387.   transform-origin: 50% 50%;
  2388.   -webkit-transition: -webkit-transform 0.3s ease;
  2389.   transition: transform 0.3s ease;
  2390. }
  2391. .zeus .tp-bullet:hover:after,
  2392. .zeus .tp-bullet.selected:after{
  2393.     -webkit-transform: scale(1.2);
  2394.   transform: scale(1.2);
  2395. }
  2396.  
  2397.  .zeus .tp-bullet-image,
  2398.  .zeus .tp-bullet-imageoverlay{
  2399.         width:135px;
  2400.         height:60px;
  2401.         position:absolute;
  2402.         background:#000;
  2403.         background:rgba(0,0,0,0.5);
  2404.         bottom:25px;
  2405.         left:50%;
  2406.         margin-left:-65px;
  2407.         box-sizing:border-box;
  2408.         background-size:cover;
  2409.         background-position:center center;
  2410.         visibility:hidden;
  2411.         opacity:0;
  2412.          -webkit-backface-visibility: hidden;
  2413.         backface-visibility: hidden;
  2414.         -webkit-transform-origin: 50% 50%;
  2415.         transform-origin: 50% 50%;
  2416.         -webkit-transition: all 0.3s ease;
  2417.         transition: all 0.3s ease;
  2418.         border-radius:4px;
  2419.  
  2420. }
  2421.          
  2422.  
  2423. .zeus .tp-bullet-title,
  2424. .zeus .tp-bullet-imageoverlay {
  2425.         z-index:2;
  2426.         -webkit-transition: all 0.5s ease;
  2427.         transition: all 0.5s ease;
  2428. }    
  2429. .zeus .tp-bullet-title {
  2430.         color:#fff;
  2431.         text-align:center;
  2432.         line-height:15px;
  2433.         font-size:13px;
  2434.         font-weight:600;  
  2435.         z-index:3;
  2436.          visibility:hidden;
  2437.         opacity:0;
  2438.          -webkit-backface-visibility: hidden;
  2439.         backface-visibility: hidden;
  2440.         -webkit-transform-origin: 50% 50%;
  2441.         transform-origin: 50% 50%;
  2442.         -webkit-transition: all 0.3s ease;
  2443.         transition: all 0.3s ease;
  2444.         position:absolute;
  2445.         bottom:45px;
  2446.         width:135px;
  2447.         vertical-align:middle;
  2448.         left:-57px;
  2449. }
  2450.      
  2451. .zeus .tp-bullet:hover .tp-bullet-title,
  2452. .zeus .tp-bullet:hover .tp-bullet-image,
  2453. .zeus .tp-bullet:hover .tp-bullet-imageoverlay{
  2454.       opacity:1;
  2455.       visibility:visible;
  2456.       -webkit-transform:translateY(0px);
  2457.       transform:translateY(0px);        
  2458.     }
  2459.  
  2460. /* THUMBS */
  2461. .zeus .tp-thumb {
  2462. opacity:1
  2463. }
  2464.  
  2465. .zeus .tp-thumb-over {
  2466.   background:#000;
  2467.   background:rgba(0,0,0,0.25);
  2468.   width:100%;
  2469.   height:100%;
  2470.   position:absolute;
  2471.   top:0px;
  2472.   left:0px;
  2473.   z-index:1;
  2474.   -webkit-transition:all 0.3s;
  2475.   transition:all 0.3s;
  2476. }
  2477.  
  2478. .zeus .tp-thumb-more:before {
  2479.   font-family: "revicons";
  2480.   font-size:12px;
  2481.   color:#aaa;
  2482.   color:rgba(255,255,255,0.75);
  2483.   display:block;
  2484.   line-height: 12px;
  2485.   text-align: left;    
  2486.   z-index:2;
  2487.   position:absolute;
  2488.   top:20px;
  2489.   right:20px;
  2490.   z-index:2;
  2491. }
  2492. .zeus .tp-thumb-more:before {
  2493.   content: "\e825";
  2494. }
  2495.  
  2496. .zeus .tp-thumb-title {
  2497.   font-family:"Raleway";
  2498.   letter-spacing:1px;
  2499.   font-size:12px;
  2500.   color:#fff;
  2501.   display:block;
  2502.   line-height: 15px;
  2503.   text-align: left;    
  2504.   z-index:2;
  2505.   position:absolute;
  2506.   top:0px;
  2507.   left:0px;
  2508.   z-index:2;
  2509.   padding:20px 35px 20px 20px;
  2510.   width:100%;
  2511.   height:100%;
  2512.   box-sizing:border-box;
  2513.   transition:all 0.3s;
  2514.   -webkit-transition:all 0.3s;
  2515.   font-weight:500;
  2516. }
  2517.  
  2518. .zeus .tp-thumb.selected .tp-thumb-more:before,
  2519. .zeus .tp-thumb:hover .tp-thumb-more:before {
  2520.  color:#aaa;
  2521.  
  2522. }
  2523.  
  2524. .zeus .tp-thumb.selected .tp-thumb-over,
  2525. .zeus .tp-thumb:hover .tp-thumb-over {
  2526.  background:#000;
  2527. }
  2528. .zeus .tp-thumb.selected .tp-thumb-title,
  2529. .zeus .tp-thumb:hover .tp-thumb-title {
  2530.   color:#fff;
  2531.  
  2532. }
  2533.  
  2534.  
  2535. /* TABS */
  2536. .zeus .tp-tab {
  2537.   opacity:1;      
  2538.   box-sizing:border-box;
  2539. }
  2540.  
  2541. .zeus .tp-tab-title {
  2542. display: block;
  2543. text-align: center;
  2544. background: rgba(0,0,0,0.25);
  2545. font-family: "Roboto Slab", serif;
  2546. font-weight: 700;
  2547. font-size: 13px;
  2548. line-height: 13px;
  2549. color: #fff;
  2550. padding: 9px 10px; }
  2551.  
  2552. .zeus .tp-tab:hover .tp-tab-title,
  2553. .zeus .tp-tab.selected .tp-tab-title {
  2554.  color: #000;
  2555.   background:rgba(255,255,255,1);
  2556. }
  2557.  
  2558.  
  2559.  
  2560. /*-----------------------------------------------------------------------------
  2561.  
  2562. - Revolution Slider 5.0 Navigatin Skin Style  -
  2563.  
  2564.  ZEUS SKIN
  2565.  
  2566. author:  ThemePunch
  2567. email:      info@themepunch.com
  2568. website:    http://www.themepunch.com
  2569. -----------------------------------------------------------------------------*/
  2570.  
  2571.  
  2572. .post-tabs .tp-thumb {
  2573. opacity:1
  2574. }
  2575.  
  2576. .post-tabs .tp-thumb-over {
  2577.   background:#252525;
  2578.   width:100%;
  2579.   height:100%;
  2580.   position:absolute;
  2581.   top:0px;
  2582.   left:0px;
  2583.   z-index:1;
  2584.   -webkit-transition:all 0.3s;
  2585.   transition:all 0.3s;
  2586. }
  2587.  
  2588. .post-tabs .tp-thumb-more:before {
  2589.   font-family: "revicons";
  2590.   font-size:12px;
  2591.   color:#aaa;
  2592.   color:rgba(255,255,255,0.75);
  2593.   display:block;
  2594.   line-height: 12px;
  2595.   text-align: left;    
  2596.   z-index:2;
  2597.   position:absolute;
  2598.   top:15px;
  2599.   right:15px;
  2600.   z-index:2;
  2601. }
  2602. .post-tabs .tp-thumb-more:before {
  2603.   content: "\e825";
  2604. }
  2605.  
  2606. .post-tabs .tp-thumb-title {
  2607.   font-family:"raleway";
  2608.   letter-spacing:1px;
  2609.   font-size:12px;
  2610.   color:#fff;
  2611.   display:block;
  2612.   line-height: 15px;
  2613.   text-align: left;    
  2614.   z-index:2;
  2615.   position:absolute;
  2616.   top:0px;
  2617.   left:0px;
  2618.   z-index:2;
  2619.   padding:15px 30px 15px 15px;
  2620.   width:100%;
  2621.   height:100%;
  2622.   box-sizing:border-box;
  2623.   transition:all 0.3s;
  2624.   -webkit-transition:all 0.3s;
  2625.   font-weight:500;
  2626. }
  2627.  
  2628. .post-tabs .tp-thumb.selected .tp-thumb-more:before,
  2629. .post-tabs .tp-thumb:hover .tp-thumb-more:before {
  2630.  color:#aaa;
  2631.  
  2632. }
  2633.  
  2634. .post-tabs .tp-thumb.selected .tp-thumb-over,
  2635. .post-tabs .tp-thumb:hover .tp-thumb-over {
  2636.  background:#fff;
  2637. }
  2638. .post-tabs .tp-thumb.selected .tp-thumb-title,
  2639. .post-tabs .tp-thumb:hover .tp-thumb-title {
  2640.   color:#000;
  2641.  
  2642. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement