API tools faq
paste
Advertisement
Guest User

Untitled

a guest
Jun 30th, 2015
206
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 9.41 KB | None | 0 0
raw download clone embed print report
  1. /*!
  2.  * Start Bootstrap - Full Slider HTML Template (http://startbootstrap.com)
  3.  * Code licensed under the Apache License v2.0.
  4.  * For details, see http://www.apache.org/licenses/LICENSE-2.0.
  5.  */
  6.  
  7. html,
  8. body {
  9.     height: 100%;
  10. }
  11.  
  12. #slides {
  13.     display:none;
  14. }
  15.  
  16. @font-face {
  17.     font-family: Cochin ;
  18.     src: url("../fonts/font.otf") format("opentype");
  19. }
  20.  
  21.  
  22. .dropdown ul.dropdown-menu {
  23.  
  24.     box-shadow:none;
  25. }
  26.  
  27.  
  28. .centered {
  29.     position: fixed;
  30.     top: 45%;
  31.     width: 100%;
  32.     text-align: center;
  33.     left: 50%;
  34.  
  35.     -webkit-transform: translate(-50%, -50%);
  36.     -moz-transform:    translate(-50%, -50%);
  37.     -ms-transform:     translate(-50%, -50%);
  38.     -o-transform:      translate(-50%, -50%);
  39.     transform:         translate(-50%, -50%);
  40. }
  41.  
  42.  
  43.  
  44.  
  45. .centered {
  46.     position: fixed;
  47.     top: 45%;
  48.     width: 100%;
  49.     text-align: center;
  50.     left: 50%;
  51. }
  52.  
  53.  
  54. .transbox {
  55.     background-color: #ffffff;
  56.  
  57.     /*border: 1px solid black;*/
  58.     opacity: 0.6;
  59.     filter: alpha(opacity=60);
  60. }
  61.  
  62. .websiteTextContent {
  63.     width: 30%;
  64.     margin-top: 5%;
  65.     display: inline-block;
  66.     font-family: Cochin
  67. }
  68.  
  69.  
  70.  
  71.  
  72.  
  73. .carousel,
  74. .item,
  75. .active {
  76.     height: 100%;
  77. }
  78.  
  79. .carousel .carousel-indicators li {
  80.     color: #fff;
  81.     opacity: 0.5;
  82. }
  83. .carousel .carousel-indicators li.active {
  84.     opacity: 0.0;
  85. }
  86.  
  87.  
  88. .carousel-inner {
  89.     height: 100%;
  90. }
  91. .navbar {
  92.     background-color: transparent;
  93.     background: transparent;
  94.     border-color: transparent;
  95.     font-family:  Cochin;
  96. }
  97.  
  98. .dropdown-menu {
  99.     background-color: transparent;
  100.     background: transparent;
  101.     min-width: 0 !important;
  102.     max-width: 102.75px;
  103. }
  104.  
  105. .dropdown ul.dropdown-menu {
  106.   box-shadow: none;
  107.   padding: 0%;
  108.   border: none;
  109. }
  110.  
  111. .dropdown-menu>li>a {
  112.     color: #fff
  113.     /*border: 1px solid black;*/
  114.     opacity: 0.6;
  115.     filter: alpha(opacity=60);
  116.     text-align: right;
  117. }
  118.  
  119. .navbar-inverse .navbar-nav>li>a {
  120.     color: #fff !important;
  121.     opacity: 0.6;
  122. }
  123.  
  124.  
  125. .navbar li { color: #000 }
  126.  
  127. .navbar-inverse .navbar-nav>.open>a, .navbar-inverse .navbar-nav>.open>a:focus, .navbar-inverse .navbar-nav>.open>a:hover{
  128.     background-color: transparent;
  129.     background: transparent;
  130.     border-color: transparent;
  131. }
  132.  
  133. /* Background images are set within the HTML using inline CSS, not here */
  134.  
  135. .fill {
  136.     width: 100%;
  137.     height: 100%;
  138.     background-position: center;
  139.     -webkit-background-size: cover;
  140.     -moz-background-size: cover;
  141.     background-size: cover;
  142.     -o-background-size: cover;
  143. }
  144.  
  145. footer {
  146.     margin: 50px 0;
  147. }
  148.  
  149. .carousel {
  150.     margin-bottom: 0px;
  151. }
  152.  
  153. .carousel .container {
  154.     position: relative;
  155.     z-index: 9;
  156. }
  157.  
  158. .carousel-control {
  159.     height:50%
  160. font-size: 120px;
  161.     text-shadow: 0 1px 1px rgba(0,0,0,.4);
  162.     background-color: transparent;
  163.     border: 0;
  164.     z-index: 10;
  165.  
  166. }
  167.  
  168.  
  169.  
  170.  
  171.  
  172. .carousel-control.left {
  173.     position: fixed;
  174.     top: 25%;
  175.     height: 50%;
  176.     background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, .5) 0%, rgba(0, 0, 0, .0001) 0%);
  177.     background-image:      -o-linear-gradient(left, rgba(0, 0, 0, .5) 0%, rgba(0, 0, 0, .0001) 0%);
  178.     background-image: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, .0)), to(rgba(0, 0, 0, .0000)));
  179.     background-image:         linear-gradient(to right, rgba(0, 0, 0, .5) 0%, rgba(0, 0, 0, .0001) 0%);
  180.     filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#80000000', endColorstr='#00000000', GradientType=0);
  181.     background-repeat: none;
  182. }
  183. .carousel-control.right {
  184.     position: fixed;
  185.     top: 25%;
  186.     height: 50%;
  187.     right: 0;
  188.     left: auto;
  189.     background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, .5) 0%, rgba(0, 0, 0, .0001) 0%);
  190.     background-image:      -o-linear-gradient(left, rgba(0, 0, 0, .5) 0%, rgba(0, 0, 0, .0001) 0%);
  191.     background-image: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, .0)), to(rgba(0, 0, 0, .0000)));
  192.     background-image:         linear-gradient(to right, rgba(0, 0, 0, .5) 0%, rgba(0, 0, 0, .0001) 0%);
  193.     filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#80000000', endColorstr='#00000000', GradientType=0);
  194.     background-repeat: none;
  195. }
  196.  
  197.  
  198.  
  199. .carousel .item {
  200.     height: 100%;
  201. }
  202. .carousel img {
  203.  
  204.     top: 0;
  205.     left: 0;
  206.     min-width: 100%;
  207.     height: 500px;
  208. }
  209.  
  210. *{
  211.     margin: 0px;
  212.     padding: 0px;
  213. }
  214. body, html{
  215.     height: 100%;
  216. }
  217. .bx-viewport, .bx-wrapper{
  218.     position:relative;
  219.     width:100%;
  220.     height:100% !important;
  221.     top:0;
  222.     left:0;
  223. }
  224. .bxslider, .bxslider li{
  225.     height: 100% !important;
  226.  
  227. }
  228. .bxslider li{
  229.     background-repeat: no-repeat;
  230.     background-position: top center;
  231.     background-size: cover;
  232.  
  233. }
  234.  
  235. .bx-wrapper .bx-viewport{
  236.     border: none !important;
  237. }
  238.  
  239.  
  240. a.pager-active > div{
  241.     display:inline;
  242.     outline:none;
  243. }
  244.  
  245. .bx-pager a > div{
  246.     display:inline;
  247.     padding:2px;
  248.     position:relative;
  249.     top:10px;
  250.     outline:none;
  251. }
  252.  
  253.  
  254.  
  255. .carousel-caption {
  256.     background-color: transparent;
  257.     position: static;
  258.     max-width: 550px;
  259.     padding: 0 20px;
  260.     margin:0 auto;
  261.     margin-top: 200px;
  262.     text-align:center;
  263. }
  264. .carousel-caption h1,
  265. .carousel-caption .lead {
  266.     margin: 0;
  267.     line-height: 1.25;
  268.     color: #fff;
  269.     text-shadow: 0 1px 1px rgba(0,0,0,.4);
  270. }
  271. .carousel-caption .btn {
  272.     margin-top: 10px;
  273. }
  274.  
  275.  
  276.  
  277. /* RESPONSIVE CSS
  278. -------------------------------------------------- */
  279.  
  280. @media (max-width: 480px)
  281. {
  282.  
  283.     .carousel .item {
  284.         height: 100%;
  285.     }
  286.     .carousel img {
  287.         width: auto;
  288.         height: 500px;
  289.     }
  290.  
  291.  
  292. }
  293. .container{
  294.     width: 100%;
  295.     padding-right: 0px;
  296. }
  297. .navbar-toggle{
  298.     margin-right: 15px;
  299. }
  300.  
  301.  
  302. }
  303.  
  304.  
  305. @media (max-width: 767px) {
  306.  
  307.  
  308.     .carousel {
  309.         margin-left: -20px;
  310.         margin-right: -20px;
  311.     }
  312.     .carousel .container {
  313.  
  314.     }
  315.     .carousel .item {
  316.         height: 100%;
  317.     }
  318.     .carousel img {
  319.         height: 300px;
  320.     }
  321.     .carousel-caption {
  322.         width: 65%;
  323.         padding: 0 70px;
  324.         margin-top: 100px;
  325.     }
  326.     .carousel-caption h1 {
  327.         font-size: 30px;
  328.     }
  329.     .carousel-caption .lead,
  330.     .carousel-caption .btn {
  331.         font-size: 18px;
  332.     }
  333.     .container-fluid>.navbar-collapse, .container-fluid>.navbar-header, .container>.navbar-collapse, .container>.navbar-header {
  334.         margin-right: 0;
  335.         margin-left: 0;
  336.     }
  337.  
  338.  
  339.  
  340.  
  341. }
  342.  
  343. @media (max-width: 992px) {
  344.     .navbar-header {
  345.         float: none;
  346.     }
  347.     .navbar-toggle {
  348.         display: block;
  349.     }
  350.     .navbar-collapse {
  351.         border-top: 1px solid transparent;
  352.         box-shadow: inset 0 1px 0 rgba(255,255,255,0.1);
  353.     }
  354.     .navbar-collapse.collapse {
  355.         display: none!important;
  356.     }
  357.     .navbar-nav {
  358.         float: none!important;
  359.         margin: 7.5px - 15px;
  360.     }
  361.     .navbar-nav>li {
  362.         float: none;
  363.     }
  364.     .navbar-nav>li>a {
  365.         padding-top: 10px;
  366.         padding-bottom: 10px;
  367.     }
  368.     .navbar-text {
  369.         float: none;
  370.         margin: 15px 0;
  371.     }
  372.     /* since 3.1.0 */
  373.     .navbar-collapse.collapse.in {
  374.         display: block!important;
  375.     }
  376.     .collapsing {
  377.         overflow: hidden!important;
  378.     }
  379.     .websiteTextContent {
  380.         width: 70%;
  381.         margin-top: 5%;
  382.         display: inline-block;
  383.         font-family: Cochin;
  384.     }
  385.     .navbar-inverse .navbar-nav .open .dropdown-menu .divider{
  386.         background-color: #9d9d9d;
  387.     }
  388.     .navbar-inverse .navbar-collapse, .navbar-inverse .navbar-form{
  389.         border-color: #9d9d9d;
  390.     }
  391.  
  392.  
  393.  
  394.  
  395.     .header-logo img {
  396.         max-width: 300px;
  397.         height: auto;
  398.         width: 70%;
  399.     }
  400.  
  401.     .footer-logo-tphc {
  402.         display: none;
  403.     }
  404.     .instagram {
  405.         margin-top: 0px;
  406.     }
  407.     .footer-logo {
  408.         margin-bottom: 20px;
  409.     }
  410.  
  411. }
  412.  
  413. }
  414.  
  415.  
  416. html, body, .container {
  417.     height: 100%;
  418.  
  419. }
  420. .container-fluid>.navbar-collapse, .container-fluid>.navbar-header, .container>.navbar-collapse, .container>.navbar-header{
  421.     margin-right: 0px;
  422.     margin-left: 0px;
  423. }
  424. @media (min-width: 768px){
  425.  
  426.     ul.nav a:hover {
  427.         opacity: 1 !important;
  428.  
  429.     }
  430.  
  431. }
  432. @media (min-width: 992px){
  433.  
  434.     .header-logo {
  435.         display: none;
  436.     }
  437.  
  438.     .footer-logo-tphc {
  439.         max-width: 100%;
  440.         height: auto;
  441.         width: 50%;
  442.         float: left;
  443.     }
  444.  
  445.  
  446.     .footer-logo {
  447.         margin-top: 0px;
  448.         margin-bottom: 10px;
  449.     }
  450.  
  451.     .instagram {
  452.         margin-top: 30px;
  453.     }
  454.  
  455.  
  456. }
  457.  
  458. @media (max-width: 212px){
  459.  
  460.     .header-logo img {
  461.         width: 60%;
  462.     }
  463. }
  464.  
  465. @media (max-width: 163px){
  466.  
  467.     .header-logo img {
  468.         display: none;
  469.     }
  470. }
  471.  
  472.  
  473. .dropdown-menu > li > a:hover {
  474.     background-color: transparent;
  475.     opacity: 1;
  476.     color: #fff;
  477. }
  478.  
  479. .activeNavHref {
  480.     opacity: 1 !important;
  481. }
  482.  
  483.  
  484.  
  485. .footer-logo {
  486.     bottom: 0;
  487.     width: 51%;
  488.     position: fixed;
  489. }
  490.  
  491. .instagram {
  492.     opacity: 0.5;
  493.     float: right;
  494. }
  495.  
  496.  
  497.  
  498. .instagramActive{
  499.     border: solid 1px white;
  500.     opacity: 1;
  501.     color: black;
  502. }
  503.  
  504. .bx-wrapper .bx-pager, .bx-wrapper .bx-controls-auto {
  505.     bottom: 0;
  506.     margin-top: 0px;
  507.     padding-top: 0px !important;
  508.     margin-bottom: 5px;
  509.     position:fixed;
  510. }
  511.    
  512.     .navbar-inverse .navbar-nav .open .dropdown-menu>li>a
  513.     {
  514.         color: #fff !important;
  515.         /*border: 1px solid black;*/
  516.         opacity: 0.6;
  517.         filter: alpha(opacity=60);
  518.         text-align: right;
  519.     }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!