API tools faq
paste
Advertisement
Guest User

style

a guest
Jun 10th, 2015
410
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 11.62 KB | None | 0 0
raw download clone embed print report
  1. /* Getting the new tags to behave */
  2. article, aside, audio, canvas, command, datalist, details, embed, figcaption, figure, footer, header, hgroup, keygen, meter, nav, output, progress, section, source, video {
  3.     display: block;
  4. }
  5. mark, rp, rt, ruby, summary, time {
  6.     display: inline
  7. }
  8. /* Global properties ======================================================== */
  9. body { 
  10.     font-family: 'PT Serif Caption', serif;
  11.     font-size:14px;
  12.     line-height:24px;
  13.     color:#343434;
  14.     min-width:1020px;
  15.     background:url(../images/bg-body.gif) #e6e4d7;
  16.     text-transform:uppercase
  17. }
  18. html, body {
  19.     height:100%;
  20. }
  21. .ic {
  22.     border:0;
  23.     float:right;
  24.     background:#fff;
  25.     color:#f00;
  26.     width:50%;
  27.     line-height:10px;
  28.     font-size:10px;
  29.     margin:-220% 0 0 0;
  30.     padding:0;
  31.     overflow:hidden
  32. }
  33. p {
  34.     padding-bottom:18px;
  35.     color: #000;
  36. }
  37.  
  38.  
  39. a {
  40.     color:#063;
  41.     text-decoration:none;
  42. }
  43. h1 {
  44.     float:left;
  45.     display:block;
  46.     position:relative;
  47.     z-index:10;
  48. }
  49.  
  50. h1 a {
  51.     display:block;
  52. }
  53.  
  54. h2,h3,h4,h5,h6{
  55. font-family: 'PT Serif Caption', serif;
  56. font-weight:normal;
  57. color:#343434}
  58. h3 {   
  59.     font-size:35px;
  60.     line-height:38px;  
  61.     padding:33px 0 18px;
  62.     text-shadow:0 1px 2px #c5c2a9;
  63.    
  64. }
  65. h3 span {color:#063;
  66.     display:block;
  67.     margin-bottom:-9px;}
  68. h3 strong{font-weight:normal;color:#d53827}
  69. h3 em{color:#999;
  70. font-size:20px;
  71. line-height:24px;
  72. display:block;
  73. font-style:normal} 
  74.    
  75. h4 {
  76.     font-size:20px;
  77.     line-height:28px;
  78.     display:block;
  79.     color:#063;
  80. }
  81.  
  82. h5 {
  83.     color:#fff;
  84.     font-size:15px;
  85.     line-height:18px;
  86.     padding:0 0 8px 0;
  87.     font-weight:normal;
  88. }
  89. h6 {
  90.     color:#2d2f38;
  91.     font-size:20px;
  92.     line-height:20px;
  93.     padding:0 0 19px 0;
  94.     font-weight:bold;
  95. }
  96.  
  97. .padd-1{padding-top:11px}
  98. .padd-2{padding-top:15px}
  99. .inner-1{padding-right:35px}
  100.  
  101. .relative {
  102.     position:relative
  103. }
  104.  
  105. /* Global Structure ============================================================= */
  106.  
  107.  
  108. .main {
  109.     margin: 0 auto;
  110.     position: relative;
  111.     width: 940px;}
  112.  
  113. .overflow {overflow:hidden;}
  114.  
  115. /* Header */
  116.  
  117.  
  118. header {   
  119.     padding:0;
  120.     position: relative;
  121.     z-index:99;
  122.     background:url(../images/tail-header.gif);
  123. }
  124.  
  125. .line-top{
  126.     background:url(../images/line-top.gif) repeat-x  0 0;
  127.     height:7px;
  128. }
  129.  
  130. .row-top{padding:21px 0 14px}
  131. /* Content */
  132. #content {
  133.     position:relative;
  134. }
  135.  
  136. /* Left & Right alignment */
  137.  
  138. .fleft {
  139.     float:left;
  140. }
  141. .fright {
  142.     float:right;
  143. }
  144. .clear {
  145.     clear:both;
  146. }
  147. .alignright {
  148.     text-align:right;
  149. }
  150. .aligncenter {
  151.     text-align:center;
  152. }
  153. .wrapper {
  154.     width:100%;
  155.     overflow:hidden;
  156. }
  157. .overflow {
  158.     overflow:hidden;
  159. }
  160. /*----- other -----*/
  161. .img-indent {
  162.     float:left;
  163.     margin:1px 30px 0 0
  164. }
  165. .img-indent1 { 
  166.     margin:4px 0 24px 0
  167. }
  168.  
  169. /*===== menu =====*/
  170. nav {
  171.     padding:18px 0 0 0;
  172.     float:right;
  173.     display:block;
  174.     z-index:99;
  175. }
  176. .sf-menu, .sf-menu * {
  177.     margin:         0;
  178.     padding:        0;
  179.     list-style:     none;
  180. }
  181. .sf-menu {
  182.     position:relative;
  183. }
  184. .sf-menu > li {
  185.     margin-left:7px;
  186.     float:left;
  187.     position:relative;
  188.     -webkit-transition: all 0.3s ease;
  189.     -moz-transition: all 0.3s ease;
  190.     -o-transition: all 0.3s ease;
  191.     transition: all 0.3s ease;
  192.     border-radius:4px;
  193.     background:url(../images/point.png)
  194. }
  195.  
  196. .sf-menu  a {
  197.     color:#343434;
  198.     font-size:14px;
  199.     line-height:20px;
  200.     text-decoration:none;
  201. }
  202.  
  203. .sf-menu > li > a {
  204.     display:block;
  205.     padding:12px 14px;
  206. }
  207.  
  208. .sf-menu ul {
  209.     position:       absolute;
  210.     top:            -999em;
  211.     width:          160px;
  212.     display:none;
  213.     background:url(../images/bg-body.gif);
  214.     padding:11px 14px 14px;
  215.     border-radius:8px;
  216.     -moz-border-radius:8px;
  217.     -webkit-border-radius:8px;
  218.     box-shadow:inset 0 1px 3px #c5c2a9;
  219.     -moz-box-shadow: inset 0 1px 3px #c5c2a9;
  220.     -webkit-box-shadow: inset 0 1px 3px #c5c2a9;
  221.  
  222. }
  223. .sf-menu > li.sfHover , .sf-menu > li:hover, .sf-menu li.active {
  224.     background:url(../images/tail-item.gif);
  225.        box-shadow:inset 0 1px 3px #c5c2a9;
  226.     -moz-box-shadow: inset 0 1px 3px #c5c2a9;
  227.     -webkit-box-shadow: inset 0 1px 3px #c5c2a9;
  228.    
  229. }
  230.  
  231. .sf-menu > li.sfHover > a, .sf-menu > li > a:hover, .sf-menu li.active a {
  232.     color:#063;
  233.  
  234.    
  235. }
  236.  
  237.  
  238. .sf-menu li li.sfHover > a, .sf-menu li li a:hover, .sf-menu li li a.active {
  239.     color:#d53827;
  240. }
  241. .sf-menu li:hover ul, .sf-menu li.sfHover ul {
  242.     left:           0px;
  243.     top:            47px; /* match top ul list item height */
  244.     z-index:        99;
  245. }
  246. ul.sf-menu li:hover li ul, ul.sf-menu li.sfHover li ul {
  247.     top:            -999em;
  248. }
  249. ul.sf-menu li li:hover ul, ul.sf-menu li li.sfHover ul {
  250.     left:           256px; /* match ul width */
  251.     top:            27px;
  252. }
  253. ul.sf-menu li li:hover li ul, ul.sf-menu li li.sfHover li ul {
  254.     top:            -999em;
  255. }
  256. ul.sf-menu li li li:hover ul, ul.sf-menu li li li.sfHover ul {
  257.     left:           10em; /* match ul width */
  258.     top:            0px;
  259. }
  260.  
  261. /*===== content =====*/
  262.  
  263. #content {
  264.     padding:0 0 44px;
  265.     background:url(../images/tail-cont.gif)
  266. }
  267.  
  268. .border-horiz{background:url(../images/border-horiz.gif) repeat-x 0  0;height:2px}
  269. .border-horiz.extra{margin-top:40px}
  270. .border-horiz.extra1{margin-top:24px}
  271. .box-slogan{text-align:center;width:940px;margin:0 auto;padding-bottom:15px}
  272. .box-slogan h3{
  273.     padding-bottom:12px;
  274.     color: #063;
  275. }
  276.  
  277. .thumbnail-1 figure{margin-bottom:18px}
  278. .box-img{
  279.     padding:10px;
  280.     background:#fff;
  281.     border-radius:16px;
  282.     -moz-border-radius:16px;
  283.     -webkit-border-radius:16px;
  284.      box-shadow:0 0 3px #c5c2a9;
  285.     -moz-box-shadow: 0 0 3px #c5c2a9;
  286.     -webkit-box-shadow:0 0 3px #c5c2a9;
  287.     display:inline-block
  288.     }
  289. .box-img img{  
  290.     border-radius:7px;
  291.     -moz-border-radius:7px;
  292.     -webkit-border-radius:7px;}
  293.    
  294. .row-1{padding-bottom:40px}
  295. .quote-1{
  296. font-style:italic;
  297. position:relative;
  298. padding-left:30px} 
  299. .quote-1:before{
  300. width:27px;
  301. height:21px;
  302. position:absolute;content:"";
  303. background:url(../images/quote-part.png) no-repeat 0 0;
  304. left:0;
  305. top:0}
  306. .name-author{
  307. text-align:right;
  308. color:#063;
  309. font-style:italic}
  310.  
  311. .list-popular.news{padding-right:22px}
  312. .list-popular a{
  313. font-size:20px;
  314. color:#063;
  315. line-height:24px;
  316. margin-bottom:2px;
  317. display:inline-block}
  318. .list-popular a:hover{color:#343434}
  319.  
  320. .list-dropcap{overflow:hidden;margin-left:-25px;padding-top:25px}
  321. .list-dropcap li{float:left;width:190px;margin-left:25px}
  322. .list-dropcap a{
  323. color:#063;
  324. font-size:20px;
  325. line-height:24px}
  326. .list-dropcap a:hover{color:#d53827;}
  327.  
  328. .dropcap{float:left;width:54px;
  329. background:#d53827;
  330. border-radius:26px;
  331. -moz-border-radius:26px;
  332. -webkit-border-radius:26px;
  333. font-size:45px;
  334. line-height:48px;
  335. text-transform:uppercase;
  336. color:#fff;
  337. text-align:center;
  338. padding:1px 0 5px;
  339. margin:0 12px 18px 0
  340. }
  341. .list-dropcap1{padding-top:10px}
  342. .list-dropcap1 .dropcap{background:#000;margin-bottom:8px}
  343. .list-dropcap1 li{padding-bottom:32px}
  344. .list-dropcap1 h4{color:#343434;line-height:24px}  
  345. .side-bar{
  346. width:280px;
  347. float:left;
  348. margin:20px 20px 0 -30px;
  349. padding:0 10px 7px 40px;
  350. background:#fff;
  351.     border-radius:18px;
  352.     -moz-border-radius:18px;
  353.     -webkit-border-radius:18px;
  354.      box-shadow:0 0 3px #c5c2a9;
  355.     -moz-box-shadow: 0 0 3px #c5c2a9;
  356.     -webkit-box-shadow:0 0 3px #c5c2a9;
  357. }  
  358. .side-bar.extra{padding:18px 10px 0 40px}  
  359. .side-bar.extra1{padding:0px 20px 27px 30px}       
  360. .list-1 {padding:6px 0 23px}
  361.  
  362. .list-1 li {
  363.     background:url(../images/marker-1.png) no-repeat 7px 10px;
  364.     padding:0 0 0 20px;
  365.     display:block;
  366.     line-height:24px;
  367. }
  368. .list-1 li a {
  369.     display:inline-block;
  370.     -webkit-transition: all 0.2s ease;
  371.     -moz-transition: all 0.2s ease;
  372.     -o-transition: all 0.2s ease;
  373.     transition: all 0.2s ease;
  374.     color:#d53827;
  375. }
  376. .list-1 li a:hover{color:#343434}
  377.  
  378. .list-teachers{}
  379. .list-teachers li{padding-bottom:25px}
  380. .list-teachers li figure{float:left;margin-right:30px}
  381.  
  382. .list-recipes{}
  383. .list-recipes li figure{float:left;margin-right:30px}
  384. .list-recipes li h4{padding-top:14px}
  385. .list-recipes li{padding-bottom:30px}
  386. .list-recipes.extra h4{padding-top:10px}
  387.  
  388. .privacy {
  389.     width:750px;
  390.     padding:0 0 0 0
  391. }
  392.  
  393. /*----- lists -----*/
  394.  
  395.  
  396. /*----- links -----*/
  397. .link-1{color:#063}
  398. .link-1:hover{text-decoration:none;
  399. color:#343434}
  400.  
  401. /*----- btns -----*/
  402.  
  403. .btn {
  404.     display:inline-block;
  405.     color:#fff;
  406.     padding:8px 16px;
  407.     background:#063;
  408.     -webkit-transition: all 0.3s ease;
  409.     -moz-transition: all 0.3s ease;
  410.     -o-transition: all 0.3s ease;
  411.     transition: all 0.3s ease;
  412.     box-shadow:0 1px 2px #c5c2a9;
  413.     -moz-box-shadow: 0 1px 2px #c5c2a9;
  414.     -webkit-box-shadow:0 1px 2px #c5c2a9;
  415. }
  416. .btn:hover {
  417.     background:#063
  418. }
  419.  
  420. /*----- forms -----*/
  421.  
  422. #contact-form input.btn{height: initial;}
  423.  
  424. #contact-form input.btn{
  425. height: initial
  426. width: auto !Important;
  427. background: #f5f5f5;
  428. color: #000;
  429. border-color: #c8c8c8;
  430. padding: 5px;
  431. margin-top: 0.5em;
  432. }
  433.  
  434. .box-contact{
  435.     background:#fff;
  436. width:940px;
  437. margin:60px auto 0;
  438. padding:0 40px 51px;
  439. background:#fff;
  440.     border-radius:18px;
  441.     -moz-border-radius:18px;
  442.     -webkit-border-radius:18px;
  443.      box-shadow:0 0 3px #c5c2a9;
  444.     -moz-box-shadow: 0 0 3px #c5c2a9;
  445.     -webkit-box-shadow:0 0 3px #c5c2a9;
  446. }
  447.  
  448. .coll-1,.coll-2{float:left;width:450px;}
  449. .coll-2{float:right}
  450.  
  451.  
  452. .box-contact .btn{margin-top:2px}
  453. #contact-form {
  454.   position: relative;
  455.   vertical-align: top;
  456.   z-index: 1;
  457.   margin: 0;
  458.   padding: 0;
  459. }
  460. #contact-form fieldset {
  461.   border: none;
  462.   padding: 0;
  463.   width: 100%;
  464.   overflow: hidden;
  465. }
  466. #contact-form label {
  467.   min-height: 54px;
  468.   position: relative;
  469.   margin: 0;
  470.   overflow: hidden;
  471.   display: block;
  472.   float: left;
  473.   width: 100%;
  474. }
  475. #contact-form .message {
  476.   min-height: 213px;
  477.   display: block;
  478.   width: 100%;
  479. }
  480. #contact-form input,
  481. #contact-form textarea {
  482.   font-family: 'PT Serif Caption', serif;
  483.   padding: 4px 12px 5px;
  484.   text-transform:uppercase;
  485.   margin: 0;
  486.   font-size:14px;
  487.   display: block;
  488.   line-height: 24px !important;
  489.   color: #343434;
  490.   background: #e8e7de;
  491.   outline: none;
  492.   width: 94%;
  493.   border: 1px solid #d1cfbd;
  494.   box-shadow: none;
  495.   border-radius: 0px;
  496.   float: left;
  497. }
  498. #contact-form input {
  499.   height: 24px;
  500. }
  501. #contact-form textarea {
  502.   height: 184px;
  503.   resize: none;
  504.   overflow: auto;
  505. }
  506. #contact-form textarea:focus,
  507. #contact-form input[type="text"]:focus {
  508.   box-shadow: none;
  509.  
  510. }
  511. #contact-form .area .error {
  512.   float: none;
  513. }
  514. #contact-form .success {
  515.   display: none;
  516.   margin-bottom: 10px;
  517.    background: #e8e7de;
  518.   font-size: 14px;
  519.   line-height: 16px;
  520.   position: relative;
  521.   border: 1px solid #d1cfbd;
  522.   padding: 10px;
  523. }
  524. #contact-form .error,
  525. #contact-form .empty {
  526.   color: #f00;
  527.   font-size: 11px;
  528.   line-height: 1.27em;
  529.   display: none;
  530.   overflow: hidden;
  531.   margin-bottom: 5px;
  532.   padding: 2px 4px 6px;
  533.   float: left;
  534. }
  535.  
  536. #contact-form a{cursor:pointer}
  537.  
  538.  
  539. .form-txt{padding-bottom:2px}
  540. .btns {overflow:hidden;
  541. padding-left:370px}
  542. .btns a{float:left;margin-right:40px}
  543. /*----- map -----*/
  544. .map {
  545.     float:left;
  546.     margin:0
  547. }
  548. iframe {
  549.     height: 182px;
  550.     overflow: hidden;
  551.     width: 630px;
  552.  
  553. }
  554. /*----- adress -----*/
  555.  
  556. .box-address {
  557. float:left;
  558. width:260px;
  559. margin-right:30px;
  560. padding-top:9px
  561. }
  562.  
  563. dl {padding-top:2px
  564. }
  565. dt {
  566.     padding-bottom:5px;
  567. }
  568. dd {
  569.     display:inline-block;
  570. }
  571. dl dd span {
  572.     display: inline-block;
  573.     width: 94px;
  574.     }
  575. .mail-1{
  576.     color:#063;
  577.     text-decoration:none;
  578.    
  579. }
  580. .mail-1:hover{
  581.     text-decoration:underline;
  582.     color: #063;
  583. }
  584.  
  585. /*===== footer =====*/
  586.  
  587. footer {
  588.     position:relative;
  589.     padding:31px 0 20px;
  590.     background:url(../images/tail-bg-footer.gif) repeat-x 0 0;
  591.    
  592. }
  593. .policy {
  594.     float:right;
  595.     display:block;
  596.     font-size:14px;
  597.     color:#343434;
  598.     line-height:16px;
  599.     text-decoration:none;
  600.     padding:8px 90px 0 0;
  601. }
  602.  
  603. .policy a {
  604.     color:#063;
  605.     text-decoration:none;  
  606.    
  607.    
  608. }
  609. .policy a:hover {
  610.     text-decoration:underline;
  611. }
  612.  
  613. /*----- social -----*/
  614. .soc-list {float:left; 
  615.     display:block;
  616.     padding-left:73px
  617. }
  618. .soc-list li {
  619.     padding:0 5px 0 0;
  620.     float:left;
  621. }
  622. .soc-list li a {
  623.     display:block;
  624.     opacity:1;
  625.     background:url(../images/bg-body.gif);
  626. }
  627. .soc-list li a:hover{opacity:0.7}
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!