API tools faq
paste
Advertisement
cypherine

letterscss.css

cypherine
Jan 19th, 2022 (edited)
61
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 10.23 KB | None | 0 0
raw download clone embed print report
  1. body {
  2.     min-width: 1000px;
  3.     color: #2b2b2d;
  4.     font-size: 14px;
  5.     font-family: "Hiragino Kaku Gothic Pro",arial,helvetica,sans-serif;
  6.     line-height: 1.4;
  7.     -webkit-text-size-adjust: none;
  8.     cursor: url(https://cdn.custom-cursor.com/db/10944/32/sanrio-cinnamoroll-and-umbrella-cursor.png), auto;
  9.   }
  10.  
  11.   ul {
  12.     list-style-type: none;
  13.    }
  14.  
  15.  
  16.  
  17.   a {
  18.     color: #eb5278;
  19.     text-decoration: none;
  20.     outline: none;
  21.   }
  22.  
  23.   a.gr {
  24.     color: #2b2b2d;
  25.     text-decoration: none;
  26.     outline: none;
  27.   }
  28.  
  29.   a:hover {
  30.     color: #eb5278;
  31.     text-decoration: underline
  32.   }
  33.  
  34.   a.gr:hover {
  35.     color: #eb5278;
  36.     text-decoration: none;
  37.   }
  38.  
  39.  
  40.   /* clearfix */
  41.   .fwrap:after,
  42.   .clearfix:after {
  43.       overflow: hidden;
  44.       clear: both;
  45.       display: block;
  46.       visibility: hidden;
  47.       height: 0;
  48.       line-height: 0;
  49.       content: " ";
  50.   }
  51.  
  52.   .fwrap,
  53.   .clearfix {
  54.       *zoom: 1;
  55.   }
  56.  
  57.   * {
  58.     cursor: url(https://cdn.custom-cursor.com/db/10944/32/sanrio-cinnamoroll-and-umbrella-cursor.png), auto;
  59.  }
  60.  
  61.   /* site_header
  62.   ----------------------------------------*/
  63.   #site_header {
  64.     position: relative;
  65.     z-index: 2011;
  66.     cursor: url(https://cdn.custom-cursor.com/db/10944/32/sanrio-cinnamoroll-and-umbrella-cursor.png), auto;
  67.   }
  68.   body.simple  {
  69.     border-top: 23px solid #f485a1;
  70.   }
  71.  
  72.   .hd_container {
  73.     position: relative;
  74.     z-index: 2020;
  75.     cursor: url(https://cdn.custom-cursor.com/db/10944/32/sanrio-cinnamoroll-and-umbrella-cursor.png), auto;
  76.    
  77.   }
  78.  
  79.   .hd_container .subNav {
  80.     padding: 3px 0;
  81.     margin-bottom: 30px;
  82.     background: #f485a1;
  83.     color: #fff;
  84.     font-size: 12px;
  85.     font-weight: bold;
  86.     text-align: right;
  87.   }
  88.  
  89.   .hd_container .subNav .cont_inner {
  90.     position: relative;
  91.     overflow: visible;
  92.     z-index: 2100;
  93.   }
  94.  
  95.   .hd_container .subNav li {
  96.     display: inline-block;
  97.     *display: inline;
  98.     *zoom: 1;
  99.   }
  100.  
  101.   .hd_container .subNav a {
  102.     color: #fff;
  103.     text-decoration: none;
  104.   }
  105.  
  106.   .hd_container .subNav .japanese,
  107.   .hd_container .subNav .english {
  108.     font-size: 10px;
  109.     padding-right: 20px;
  110.   }
  111.  
  112.  
  113.   .hd_container .subNav #socialLogin {
  114.     position: absolute;
  115.     top: -3px;
  116.     right: 20px;
  117.     width: 200px;
  118.     height: 29px;
  119.     z-index: 2100;
  120.     cursor: url(https://cdn.custom-cursor.com/db/10944/32/sanrio-cinnamoroll-and-umbrella-cursor.png), auto;
  121.   }
  122.  
  123.   .hd_container .subNav #socialLogin img {
  124.     cursor: url(https://cdn.custom-cursor.com/db/10944/32/sanrio-cinnamoroll-and-umbrella-cursor.png), auto;
  125.   }
  126.  
  127.  
  128.  
  129.   .hd_container .subNav #socialLoginWrapper.opened {
  130.     display: block;
  131.   }
  132.  
  133.  
  134.   .hd_container .logo_header {
  135.     float: left;
  136.     overflow: hidden;
  137.     width: 165px; height: 75px;
  138.     margin: 0 25px 0 25px;
  139.     /* 20190924 N-131
  140.     margin: 0 50px 0 25px;
  141.     */
  142.   }
  143.  
  144.   .hd_container .logo_header.mr_50 {
  145.     margin-right: 50px;
  146.   }
  147.  
  148.   /*
  149.    *
  150.    * 202002 N-11 add
  151.    * 日本語ページの影響出ていたのでoverride
  152.    *
  153.    */
  154.   .en .hd_container .logo_header {
  155.     margin: 0 50px 0 25px;
  156.   }
  157.  
  158.   .simple .hd_container .logo_header {
  159.     float: none;
  160.     width: 104px; height: 48px;
  161.     margin-top: 20px;
  162.   }
  163.  
  164.  
  165.   .hd_container .logo_header > a {
  166.     display: block;
  167.     overflow: hidden;
  168.     width: 165px; height: 75px;
  169.     background: url(https://www.sanrio.co.jp/common_v2/img/icon_header_character.gif) left top no-repeat;
  170.     text-indent: 100%;
  171.     white-space: nowrap;
  172.     cursor: url(https://cdn.custom-cursor.com/db/10943/32/sanrio-cinnamoroll-and-umbrella-pointer.png), auto;
  173.   }
  174.  
  175.   .cont_inner {
  176.     position: relative;
  177.     width: 1000px;
  178.     margin: 0 auto;
  179.   }
  180.  
  181.   .hd_bottom {
  182.     overflow: hidden;
  183.     position: absolute;
  184.     top:75px;
  185.     right:0;
  186.     left:0;
  187.     min-height: 34px;
  188.     margin: 30px 22px 0 20px;
  189.     background: #f5f5f6;
  190.     border-top: 1px solid #e2e3e6;
  191.     border-radius: 0 3px 3px 0 !important;
  192.     z-index: 1;
  193.   }
  194.  
  195.   .fwrap .main_container .col2 .col {
  196.     width: 345px;
  197.     margin-right: 25px;
  198.   }
  199.  
  200.   .fwrap .main_container .innerSection .col2 .col {
  201.     width: 319px;
  202.     margin-right: 30px;
  203.   }
  204.  
  205.   .fwrap .main_container .col2 .col:last-child {
  206.     margin-right: 0;
  207.   }
  208.  
  209.   /* category_nav
  210.   ----------------------------------------*/
  211.   .ctg_nav {
  212.     float: left;
  213.     overflow: hidden;
  214.     margin-top: 5px;
  215.   }
  216.  
  217.   .en .ctg_nav {
  218.     padding-bottom: 20px;
  219.   }
  220.  
  221.   .ctg_nav > li {
  222.     float: left;
  223.     font-size: 9px;
  224.     text-align: center;
  225.   }
  226.  
  227.   .ctg_nav > li a {
  228.     text-decoration: none;
  229.  
  230.   }
  231.  
  232.   .ctg_nav > .nav_chara {
  233.     background: url(https://www.sanrio.co.jp/common_v2/img/icon_header_character.gif) center 3px no-repeat;
  234.   }
  235.  
  236.   .ctg_nav > .nav_chara a:hover,
  237.   .ctg_nav > .nav_chara.current a {
  238.     color: #e74b5a;
  239.   }
  240.  
  241.   .ctg_nav > .nav_goods {
  242.     background: url(https://www.sanrio.co.jp/common_v2/img/icon_header_news.gif) center 3px no-repeat;
  243.   }
  244.   .ctg_nav > .nav_goods a:hover,
  245.   .ctg_nav > .nav_goods.current a {
  246.     color: #e49100;
  247.   }
  248.  
  249.   .ctg_nav > .nav_shop {
  250.     background: url(https://www.sanrio.co.jp/common_v2/img/icon_header_entertainment.gif) center 3px no-repeat;
  251.   }
  252.   .ctg_nav > .nav_shop a:hover,
  253.   .ctg_nav > .nav_shop.current a {
  254.     color: #e06a88;
  255.   }
  256.  
  257.   .ctg_nav > .nav_news {
  258.     background: url(https://www.sanrio.co.jp/common_v2/img/icon_header_park.gif) center 3px no-repeat;
  259.   }
  260.   .ctg_nav > .nav_news a:hover,
  261.   .ctg_nav > .nav_news.current a {
  262.     color: #5fa4ba;
  263.   }
  264.  
  265.   .ctg_nav > .nav_entame {
  266.     background: url(/common_v2/img/icon_header_entertainment.gif) center top no-repeat;
  267.   }
  268.   .ctg_nav > .nav_entame a:hover,
  269.   .ctg_nav > .nav_entame.current a {
  270.     color: #789e10;
  271.   }
  272.  
  273.  
  274.  
  275.   /* 20190924 N-131 gnav start */
  276.   .ctg_nav > .nav_mypage {
  277.     cursor: url(https://cdn.custom-cursor.com/db/10943/32/sanrio-cinnamoroll-and-umbrella-pointer.png), auto;
  278.     background: url(/common_v2/img/icon_header_mypage.png) center top 6px no-repeat;
  279.   }
  280.   .ctg_nav > .nav_mypage a:hover,
  281.   .ctg_nav > .nav_mypage.current a {
  282.     color: #f485a1;
  283.   }
  284.   /* 20190924 N-131 gnav end */
  285.  
  286.   .ctg_nav > li > a {
  287.     cursor: url(https://cdn.custom-cursor.com/db/10943/32/sanrio-cinnamoroll-and-umbrella-pointer.png), auto;
  288.     display: block;
  289.     width: 81px;
  290.     height: 26px;
  291.     /* 20190924 N-131
  292.     width: 90px;
  293.     height: 20px;
  294.     */
  295.     padding: 50px 7px 0 7px;
  296.     background: url(/common_v2/img/bg_line_dashed.gif) left top repeat-y;
  297.     font-weight: bold;
  298.   }
  299.  
  300.  
  301.     /*Containers*/
  302.  
  303.     .fircon{
  304.       border-radius: 5px;
  305.       margin-top: 40px;
  306.       display: flex;
  307.       justify-content: center;
  308.       width:740px;
  309.       height:850px;
  310.       margin-left: 160px;
  311.       background-color: rgb(255, 247, 200);
  312.       position: absolute;
  313.    
  314.     }
  315.    
  316.    
  317.     .secbox{
  318.       display: flex;
  319.       justify-content: center;
  320.       width:700px;
  321.       height: 100px;
  322.       margin-top: 100px;
  323.       margin-right: auto;
  324.       margin-left: auto;
  325.       color: #066;
  326.     }
  327.    
  328.     .secbox2{
  329.       display: flex;
  330.       justify-content: center;
  331.       width:700px;
  332.       height: auto;
  333.       margin-right: auto;
  334.       margin-left: auto;
  335.       color: #066;
  336.     }
  337.     /* Love letter*/      
  338.      
  339.       .postcard {
  340.          
  341.         display: flex;
  342.         width: 600px;
  343.         height: 300px;
  344.         background-color: #f7f7f7;
  345.         margin: 0 auto;
  346.         border-radius: 2%;
  347.         justify-content: center;
  348.         box-shadow: .8em .8em 15px rgba(0,0,0,.3);
  349.         -ms-transform: rotate(2.5deg); /* IE 9 */
  350.         -webkit-transform: rotate(2.5deg); /* Chrome, Safari, Opera */
  351.         transform: rotate(2.5deg);
  352.         -moz-transition: all .5s ease;
  353.         -webkit-transition: all .5s ease;
  354.         -o-transition: all .5s ease;
  355.         transition: all .5s ease;
  356.       }
  357.      
  358.       .parentletter {
  359.         margin: 1em 1em 1em 1em;
  360.         width: 550px;
  361.         height: auto;
  362.         border: 1px solid #D4F6FD;
  363.         text-align: center;
  364.       }
  365.       .childletter {
  366.         display: inline-block;
  367.         border: 1px;
  368.         padding: 1rem 1rem;
  369.         vertical-align: middle;
  370.       }
  371.      
  372.       .letrec {
  373.         width: 150px;
  374.         height: 20px;
  375.         background-color: white;
  376.         margin-top: -20px;
  377.         margin-left: 50px;
  378.       }
  379.      
  380.       .push {
  381.         margin-left:-250px;
  382.       }
  383.       .pushafter  {
  384.         margin-top: -20px;
  385.         margin-left: 120px;
  386.       }
  387.      
  388.       .letbody {
  389.         width: 300px;
  390.         height: 100px;
  391.         background-color: white;
  392.         margin-top: 30px;
  393.       }
  394.      
  395.       .letyours {
  396.         width: 150px;
  397.         height: 20px;
  398.         background-color: white;
  399.         margin-top: -20px;
  400.         margin-left: 50px;
  401.       }
  402.      
  403.       .push2 {
  404.         margin-top: 20px;
  405.         margin-left:-250px;
  406.       }
  407.      
  408.       .letemail {
  409.         width: 150px;
  410.         height: 20px;
  411.         background-color: white;
  412.         margin-top: 30px;
  413.       }
  414.      
  415.       .letadd {
  416.         text-decoration: underline;
  417.    
  418.       }
  419.    
  420.       .letstamp {
  421.           position: absolute;
  422.           padding: 0;
  423.           margin-top: 20px;
  424.           margin-left: 400px;
  425.           height:100px;
  426.           width:100px;
  427.       }    
  428.      
  429.       /*animation*/
  430. .postcard:hover,
  431. .postcard:active,
  432. .postcard:focus{
  433.   -ms-transform: rotate(0deg); /* IE 9 */
  434.   -webkit-transform: rotate(0deg); /* Chrome, Safari, Opera */
  435.   transform: rotate(0deg);
  436.   -moz-transition: all .5s ease;
  437.   -webkit-transition: all .5s ease;
  438.   -o-transition: all .5s ease;
  439.   transition: all .5s ease;
  440. }
  441.  
  442. /* Tabs */
  443.  
  444. input.button {
  445.   position: relative;
  446.     color: white;
  447.     background-color: #def1ff;
  448.     border:2px solid #CFB79B;
  449.     margin-left: 5px;
  450.     width:100px;
  451.     height:50px;
  452.     z-index: 5;
  453.     cursor: url(https://cdn.custom-cursor.com/db/10943/32/sanrio-cinnamoroll-and-umbrella-pointer.png), auto;
  454.     font-weight: bolder;
  455.     font-size: 20px;
  456.  
  457.     -webkit-text-fill-color: white; /* Will override color (regardless of order) */
  458.     -webkit-text-stroke-width: 1px;
  459.     -webkit-text-stroke-color: pink;
  460.   }
  461.  
  462.  
  463.  
  464.   input.button:hover{
  465.         background: pink;
  466.    }
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!