API tools faq
paste
Advertisement
Guest User

Untitled

a guest
Nov 24th, 2015
62
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 13.18 KB | None | 0 0
raw download clone embed print report
  1. /*
  2.  
  3. Theme Name: Royal Blue
  4.  
  5. Theme URI: http://underscores.me/
  6.  
  7. Author: Underscores.meAuthor URI: http://underscores.me/
  8.  
  9. Description: DescriptionVersion: 1.0.0
  10.  
  11. License: GNU General Public License v2 or later
  12.  
  13. License URI: http://www.gnu.org/licenses/gpl-2.0.html
  14.  
  15. Text Domain: royalblue
  16.  
  17. Tags:
  18.  
  19.  
  20.  
  21. This theme, like WordPress, is licensed under the GPL.
  22.  
  23. Use it to make something cool, have fun, and share what you've learned with others.
  24.  
  25.  
  26.  
  27. royalblue is based on Underscores http://underscores.me/, (C) 2012-2015 Automattic, Inc.
  28.  
  29. Underscores is distributed under the terms of the GNU GPL v2 or later.
  30.  
  31. */
  32. /*
  33.  
  34. 0.0 | Variables
  35. 1.0 | Typography
  36. 1.1 | Imports
  37. 1.2 | Font
  38. 2.0 | Grid System
  39. 3.0 | Elements
  40. 4.0 | Masthead and Footer
  41. 5.0 | Navigation
  42. 5.1 | Links
  43. 5.2 | Top Menu
  44. 6.0 | Shortcuts
  45. 7.0 | Content
  46. 8.0 | Buttons
  47. 13.0 | Media Queries
  48.  
  49. */
  50. /* ----------------------------------
  51. 0.0 | Variables
  52. ---------------------------------- */
  53.  
  54.  
  55.  
  56. $base-font-size: 1em;
  57.  
  58.  
  59. $body-color: #fff;
  60.  
  61. $font-color: #22201c;
  62.  
  63. $primary-color: #111F7F;
  64. $primary-color-highlight: #182DB4;
  65. $primary-color-shadow: #11207E;
  66.  
  67. $secondary-color: #4778C2;
  68. $secondary-color-highlight: #668FCC;
  69. $secondary-color-shadow: #3865A8;
  70.  
  71. /* ------------------------------
  72. 1.0 | Typography
  73. ---------------------------------- */
  74.  
  75. /* ----------------
  76. 1.1 | Imports
  77. -------------------- */
  78.  
  79. @import url('https://fonts.googleapis.com/css?family=Lato:400,700,400italic|Cinzel:400,700,900|Great+Vibes');
  80.  
  81. /* ----------------
  82. 1.2 | Font
  83. -------------------- */
  84.  
  85. body {
  86. font-family: Lato;
  87. color: $font-color;
  88. font-size: $base-font-size * 1.1;
  89. margin: 0;
  90. background: $body-color;
  91. }
  92. p {
  93. margin-bottom: 20px;
  94. line-height: 1.3;
  95. }
  96.  
  97. h1,
  98. h2,
  99. h3,
  100. h4,
  101. h5,
  102. h6 {
  103. margin-top: 0;
  104. margin-bottom: $base-font-size / 2;
  105. font-weight: 300;
  106. font-family: 'Droid Serif';
  107. color: #11307F;
  108. }
  109.  
  110. h1 {
  111. font-size: $base-font-size * 2;
  112. }
  113. h2 {
  114. font-size: $base-font-size * 1.8;
  115. }
  116. h3 {
  117. font-size: $base-font-size * 1.6;
  118. }
  119. h4 {
  120. font-size: $base-font-size * 1.4;
  121. }
  122. h5 {
  123. font-size: $base-font-size * 1.2;
  124. }
  125. h6 {
  126. font-size: $base-font-size;
  127. }
  128.  
  129. /* Larger than phablet */
  130.  
  131. @media (min-width: 62em) {
  132. h1 {
  133. font-size: $base-font-size * 3;
  134. }
  135. h2 {
  136. font-size: $base-font-size * 2.5;
  137. }
  138. h3 {
  139. font-size: $base-font-size * 2;
  140. }
  141. h4 {
  142. font-size: $base-font-size * 1.6;
  143. }
  144. h5 {
  145. font-size: $base-font-size * 1.3;
  146. }
  147. h6 {
  148. font-size: $base-font-size;
  149. }
  150. }
  151.  
  152. /* ----------------
  153. 1.3 | Lists and Quotes
  154. -------------------- */
  155.  
  156. ol,
  157. ul {
  158. margin-bottom: 1.5 * $base-font-size;
  159. }
  160.  
  161. blockquote {
  162. padding-left: $base-font-size * 1.2;
  163. position: relative;
  164. border-left: $base-font-size solid $primary-color;
  165. font-style: italic;
  166. color: #70695C;
  167. }
  168. /*// Medium devices (tablets, 48em and up)*/
  169.  
  170. @media (min-width: 48em) {
  171. blockquote {
  172. margin: 0 $base-font-size * 2 0 $base-font-size;
  173. }
  174. }
  175.  
  176. /* ----------------------------------
  177. 2.0 | Grid System
  178. ---------------------------------- */
  179. .row:before,
  180. .row:after,
  181. .clearfix {
  182. content: " ";
  183. display: table;
  184. }
  185. .row,
  186. .container {
  187. position: relative;
  188. width: 100%;
  189. box-sizing: border-box;
  190. overflow: hidden;
  191. }
  192. .container {
  193. max-width: 1200px;
  194. margin: 0 auto;
  195. padding: 0 1em;
  196. }
  197. .column {
  198. width: 100%;
  199. float: left;
  200. box-sizing: border-box;
  201. margin-bottom: 20px;
  202. }
  203. /* For devices larger than 400px */
  204.  
  205. @media (min-width: 400px) {
  206. .container {
  207. width: 95%;
  208. }
  209. }
  210. /* For devices larger than 700px */
  211.  
  212. @media (min-width: 700px) {
  213. .column {
  214. margin-bottom: none;
  215. }
  216. .column + .column {
  217. margin-left: 4.6%;
  218. }
  219. .one {
  220. width: 3.86666666667%;
  221. }
  222. .two {
  223. width: 12.3333333333%;
  224. }
  225. .three {
  226. width: 20.8%;
  227. }
  228. .four {
  229. width: 29.2666666667%;
  230. }
  231. .five {
  232. width: 48.7333333333%;
  233. }
  234. .six {
  235. width: 46.2%;
  236. }
  237. .seven {
  238. width: 54.6666666667%;
  239. }
  240. .eight {
  241. width: 63.1333333333%;
  242. }
  243. .nine {
  244. width: 71.6%;
  245. }
  246. .ten {
  247. width: 80.0666666667%;
  248. }
  249. .eleven {
  250. width: 88.5333333333%;
  251. }
  252. .twelve {
  253. width: 100%;
  254. }
  255. .offset-by-one {
  256. margin-left: 7.66666666667%!important;
  257. }
  258. .offset-by-two {
  259. margin-left: 16.1333333333%!important;
  260. }
  261. .offset-by-three {
  262. margin-left: 23.6%!important;
  263. }
  264. .offset-by-four {
  265. margin-left: 33.0666666667!important;
  266. }
  267. .offset-by-five {
  268. margin-left: 41.5333333333!important;
  269. }
  270. .offset-by-six {
  271. margin-left: 50%!important;
  272. }
  273. .offset-by-seven {
  274. margin-left: 7.6666666667%!important;
  275. }
  276. .offset-by-eight {
  277. margin-left: 66.9333333333%!important;
  278. }
  279. .offset-by-nine {
  280. margin-left: 75.4%!important;
  281. }
  282. .offset-by-ten {
  283. margin-left: 83.8666666667%!important;
  284. }
  285. .offset-by-eleven {
  286. margin-left: 92.3333333333%!important;
  287. }
  288. }
  289. /* ----------------------------------
  290. 3.0 | Elements
  291. ---------------------------------- */
  292. img {
  293. max-width: 100%;
  294. }
  295.  
  296. .alignleft {
  297. float: left !important;
  298. }
  299.  
  300. .alignright {
  301. float:right !important;
  302. }
  303.  
  304. article {
  305. margin-bottom: 3 * $base-font-size;
  306. }
  307.  
  308.  
  309. /* ----------------------------------
  310. 4.0 | Masthead and Footer
  311. ---------------------------------- */
  312.  
  313. #masthead,
  314. .site-footer {
  315. overflow: hidden;
  316. color: $body-color;
  317. box-sizing: border-box;
  318. overflow: visible;
  319. padding-top: 0.2em;
  320. background: $primary-color;
  321. }
  322.  
  323. .site-title {}
  324. /*// Medium devices (tablets, 48em and up)*/
  325.  
  326. @media (min-width: 48em) {
  327. #masthead {} #masthead.smaller {
  328. }
  329. }
  330.  
  331. .site-branding {
  332. margin: 0;
  333. }
  334.  
  335. .site-footer .widget-area a{
  336. color: $body-color;
  337. }
  338.  
  339. .site-footer h4 {
  340. color:$body-color;
  341. }
  342. /* ----------------------------------
  343. 5.0 | Navigation
  344. ---------------------------------- */
  345.  
  346. /* ----------------
  347. 5.1 | Links
  348. -------------------- */
  349.  
  350. a {
  351. text-decoration: none;
  352. color: $secondary-color;
  353. transition: all 0.1s ease-in-out;
  354. }
  355. a:hover {
  356. color: $secondary-color-shadow;
  357. transition: all 0.1s ease-in-out;
  358. }
  359.  
  360. h1 a,
  361. h2 a,
  362. h3 a,
  363. h4 a,
  364. h5 a,
  365. h6 a {
  366. color: $primary-color;
  367. }
  368.  
  369. h1 a:hover,
  370. h2 a:hover,
  371. h3 a:hover,
  372. h4 a:hover,
  373. h5 a:hover,
  374. h6 a:hover {
  375. color: $primary-color-shadow;
  376. }
  377.  
  378. /* ----------------
  379. 5.2 | Top Menu
  380. -------------------- */
  381. /* ----------
  382. 5.2a | Mobile PushDown
  383. -------------------- */
  384.  
  385. nav.main {
  386. position: absolute;
  387. overflow: visible;
  388. z-index: 100;
  389. width: 100%;
  390. display: none;
  391. }
  392.  
  393. nav.main {
  394.  
  395. li {
  396. list-style: none;
  397. }
  398. ul {
  399. margin-bottom: 0;
  400. }
  401. a {
  402. background: $primary-color;
  403. display: block;
  404. padding: 0.5em;
  405. width: 100%;
  406. color: $body-color;
  407. }
  408. a:hover {
  409. background: #0F1B6C;
  410. color: $body-color;
  411. }
  412. .sub-menu {
  413. display: none;
  414. }
  415. .sub-menu a {
  416. padding-left: 1em;
  417. color: $font-color;
  418. background: #DBE1FA;
  419. position: relative;
  420. }
  421. .sub-menu a:hover {
  422. background: #C9D2F7;
  423. }
  424. .menu-item-has-children > a:after {
  425. content: '\f078';
  426. font-family: fontAwesome;
  427. float: right;
  428. padding-right: 1em;
  429. display: inline-block;
  430. }
  431.  
  432. .menu-item-has-children > a.arrow-down:after {
  433. transform: scaley(-1);
  434. }
  435. .open {
  436. display: block;
  437. }
  438.  
  439. }
  440. a.arrow-down:after {
  441. content: '\f077';
  442. font-family: fontAwesome;
  443. float: right;
  444. padding-right: 1em;
  445. }
  446.  
  447. .main-nav-toggle-button {
  448. width: 2em;
  449. height: 2em;
  450. background: $body-color;
  451. text-align: center;
  452. padding: 0.2em;
  453. box-sizing: content-box;
  454. float: right;
  455. margin-bottom: 1em;
  456. cursor: pointer;
  457. }
  458. .main-nav-toggle-button i {
  459. font-size: 2em;
  460. color: $primary-color;
  461. }
  462. /* ----------------------------------
  463. 6.0 | Content
  464. ---------------------------------- */
  465.  
  466. .cover-image {
  467. background-size: cover!important; /* FIND FIX FOR IMPORTANT*/
  468. }
  469.  
  470. .cover-image-title {
  471. display: block;
  472. margin: 0 auto;
  473. padding: 1em 0;
  474. color: $body-color;
  475. color: rgba(250,250,250, 0.9);
  476. text-align: center;
  477. text-transform: uppercase;
  478. font-size: 6em;
  479. font-size: 12vw;
  480. }
  481.  
  482. /*// Medium devices (tablets, 48em and up)*/
  483.  
  484. @media (min-width: 48em) {
  485. .content-area {
  486. padding: 2em 0;
  487. }
  488. }
  489.  
  490. header.entry-header {
  491. margin-bottom: 3em;
  492. }
  493. /* ----------------
  494. 7.1 | Sidebar
  495. -------------------- */
  496.  
  497. #secondary {
  498. .widget-area {
  499. padding: $base-font-size;
  500. }
  501. }
  502.  
  503. /* ----------------------------------
  504. 8.0 | Buttons
  505. ---------------------------------- */
  506.  
  507. .button-tertiary {
  508. padding: 15px;
  509. background: #ECCA16;
  510. color: $body-color;
  511. border: none;
  512. }
  513. .button-primary {
  514. font-size: 50px;
  515. padding: 10px 50px;
  516. background: $primary-color;
  517. color: $body-color;
  518. border: none;
  519. -webkit-border-radius: 15px;
  520. -moz-border-radius: 15px;
  521. border-radius: 15px;
  522. -webkit-box-shadow: 0 10px #0A1B48;
  523. -moz-box-shadow: 0 10px #0A1B48;
  524. box-shadow: 0 10px #0A1B48;
  525. outline: none;
  526. }
  527. .button-primary:active {
  528. box-shadow: 0 5px #0A1B48;
  529. transform: translateY(5px);
  530. }
  531. .screen-reader-text {
  532. clip: rect(1px, 1px, 1px, 1px);
  533. position: absolute !important;
  534. height: 1px;
  535. width: 1px;
  536. overflow: hidden;
  537. }
  538. .screen-reader-text:focus {
  539. background-color: #f1f1f1;
  540. border-radius: 3px;
  541. box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
  542. clip: auto !important;
  543. color: #21759b;
  544. display: block;
  545. font-size: 14px;
  546. font-size: 0.875rem;
  547. font-weight: bold;
  548. height: auto;
  549. left: 5px;
  550. line-height: normal;
  551. padding: 15px 23px 14px;
  552. text-decoration: none;
  553. top: 5px;
  554. width: auto;
  555. z-index: 100000;
  556. /* Above WP toolbar. */
  557. }
  558. /* Do not show the outline on the skip link target. */
  559.  
  560. #content[tabindex="-1"]:focus {
  561. outline: 0;
  562. }
  563.  
  564. /* ----------------------------------
  565. 9.0 | Forms
  566. ---------------------------------- */
  567.  
  568. #comment {
  569. color:#3c3c3c;
  570. font-family: Helvetica, Arial, sans-serif;
  571. font-weight:500;
  572. font-size: 18px;
  573. border-radius: 0;
  574. line-height: 22px;
  575. background-color: #fbfbfb;
  576. padding: 1em;
  577. margin-bottom: 10px;
  578. width:100%;
  579. -webkit-box-sizing: border-box;
  580. -moz-box-sizing: border-box;
  581. -ms-box-sizing: border-box;
  582. box-sizing: border-box;
  583. border: 3px solid $font-color;
  584. }
  585.  
  586. #comment:focus{
  587. background: $body-color;
  588. box-shadow: 0;
  589. border: 3px solid $primary-color;
  590. color: $primary-color;
  591. outline: none;
  592. }
  593.  
  594.  
  595. textarea {
  596. width: 100%;
  597. height: 150px;
  598. line-height: 150%;
  599. resize:vertical;
  600. }
  601.  
  602. input:hover, textarea:hover,
  603. input:focus, textarea:focus {
  604. background-color:white;
  605. }
  606.  
  607.  
  608. input[type=submit] {
  609. display: inline-block;
  610. font-size: 1.4em;
  611. padding: 0.2em 0.4em;
  612. background: #111F7F;
  613. width: 100%;
  614. color: $body-color;
  615. border: none;
  616. outline: none;
  617. max-width: 100%;
  618. }
  619.  
  620. input[type=submit]:active {
  621. box-shadow: 0 5px #0A1B48;
  622. }
  623.  
  624. /* ----------------------------------
  625. 13.0 | Media Queries
  626. ---------------------------------- */
  627. /*// Extra small devices (portrait phones, less than ???px)
  628.  
  629. // No media query since this is the default in Bootstrap*/
  630. /*/ Small devices (landscape phones, 34em and up) @media (min-width: 34em) { }*/
  631. /*// Medium devices (tablets, 48em and up)*/
  632.  
  633. @media (min-width: 48em) {}
  634. /*// Large devices (desktops, 62em and up)*/
  635.  
  636. @media (min-width: 62em) {}
  637. /* Extra large devices (large desktops, 75em and up) */
  638.  
  639. @media (min-width: 75em) {}
  640. /*
  641.  
  642.  
  643.  
  644.  
  645.  
  646. // Extra small devices (portrait phones, less than 34em)*/
  647.  
  648. @media (max-width: 33.9em) {
  649. .hide-mobile {
  650. display:none;
  651. }
  652. }
  653. /*/ Small devices (landscape phones, less than 48em)*/
  654.  
  655. @media (max-width: 47.9em) {}
  656. /*// Medium devices (tablets, less than 62em)*/
  657.  
  658. @media (max-width: 61.9em) {}
  659. /*// Large devices (desktops, less than 75em)*/
  660.  
  661. @media (max-width: 74.9em) {}
  662.  
  663.  
  664. /* ------------------------------ 5.0 | Shortcuts---------------------------------- */
  665.  
  666. .pull-right {
  667. float: right;
  668. }
  669. .pull-left {
  670. float: left;
  671. }
  672. .center-margins {
  673. margin: 0 auto;
  674. }
  675. .overflow-visible {
  676. overflow: visible;
  677. }
  678.  
  679. .full-width-mobile {
  680. width: 100%;
  681. padding: 0;
  682. }
  683.  
  684. .full-width {
  685. width: 100%;
  686. min-height: 60%;
  687. }
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!