API tools faq
paste
Jade-Everstone

Across the Sky (CQ 2023 May)

Jade-Everstone
May 24th, 2023 (edited)
1,242
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 27.75 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE HTML>
  2. <!--Rules:
  3.  
  4. Across the Sky
  5. For the Coders Quarters May 2023 challenge
  6. Based off the 'sky' moodboard by Togo
  7.  
  8. You may
  9. -frankenstein with other codes (as long as the creator of said code allows it)
  10. -edit/change as much as you need (example: making character codes into user codes, vice-versa)
  11.  
  12. You may not
  13. -Redistribute, resell, and/or claim its yours
  14. -Remove credit (you're allowed to move & edit it though, just keep it visible)
  15.  
  16. Misc Notes:
  17. -When editing, remember to turn WYSIWYG off! My codes may break otherwise
  18. -Some basic html knowledge is recommended for editing
  19.  
  20. Default Colors:
  21. - Header color: #43b0d1
  22.    - Header borders, header underline: #b7e7f5
  23. - Main BG: rgba(255,255,255,0.7)
  24.    - Main BG border: #f2f8fa
  25.    - body text: #000000
  26. - links: #2f8dc2
  27.  
  28.  
  29. Change the colors: Ctrl+f and search for the color you want to change.
  30.  
  31. -->
  32.  
  33. <!-- /// BACKGROUND /// -->
  34. <div style='position: absolute; top: 0px; bottom: 0px; left: 0px;
  35.    background: url("https://images.unsplash.com/photo-1536088835284-27bdf76a064b?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1935&q=80");
  36.    background-position:center;
  37.    background-size:cover;
  38.    background-attachment:fixed;
  39.    width: 100%;
  40.    z-index: -1;'>
  41. </div>
  42. <!-- /// END BACKGROUND /// -->
  43.  
  44.  
  45. <div class="container" style="max-width:1000px">
  46.    
  47.     <div class="row">
  48.        
  49.        
  50.         <!-- /// MAIN IMAGE /// -->
  51.         <div class="col-lg-4 mb-3">
  52.             <div style="top:30px;position:sticky;">
  53.                
  54.                 <!--image-->
  55.                 <div class="card bg-faded" style="height:600px;
  56.                    background-image:url(https://images.unsplash.com/photo-1498019559366-a1cbd07b5160?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=2058&q=80);
  57.                    background-size:cover;
  58.                    background-position:center;
  59.                    border-width:3px;
  60.                    border-color:#f2f8fa;
  61.                    border-radius:0px 30px;">
  62.                    
  63.                     <!--image credit-->
  64.                     <span class="text-white" style="font-size:1.25em;position:absolute;right:10px;top:5px;text-shadow:1px 1px 3px #000000;letter-spacing:2px">
  65.                    
  66.                         <a href="https://unsplash.com/photos/PUvPZckRnOg" target="_blank"><i class="fa-solid fa-circle text-white" data-toggle="tooltip" title="img - unsplash"></i></a>
  67.                        
  68.                     </span>
  69.  
  70.                     <!--character quote-->
  71.                     <div class="card px-2 py-1 m-2" style="
  72.                    min-height:30px;
  73.                    border-width:3px;
  74.                    border-radius:0px 30px;
  75.                    font-size:1.35em;
  76.                    font-style:italic;
  77.                    overflow:hidden;
  78.                    position:absolute;
  79.                    bottom:5px;right:0px;z-index:2;
  80.                    background-color:#43b0d1;
  81.                    border-color:#b7e7f5;
  82.                    color:#ffffff
  83.                    ">
  84.                    
  85.                         <span>"Character Quote. Best to keep it breif for better looks."</span>
  86.                        
  87.                     </div>
  88.                    
  89.                 </div>
  90.             </div>
  91.         </div>
  92.         <!-- /// END MAIN IMAGE /// -->
  93.        
  94.        
  95.         <!-- /// INFO SECTION /// -->
  96.         <div class="col-lg-8">
  97.             <div>
  98.                
  99.                 <!--Character Name-->
  100.                 <div class="card px-2 py-1 mb-3" style="
  101.                    min-height:30px;
  102.                    border-width:3px;
  103.                    border-radius:30px 0px;
  104.                    font-size:2.5em;
  105.                    font-style:italic;
  106.                    text-align:right;
  107.                    overflow:hidden;
  108.                    background-color:#43b0d1;
  109.                    border-color:#b7e7f5;
  110.                    color:#ffffff
  111.                ">
  112.                     <span>CHARACTER NAME <i class="fa-regular fa-wind"></i></span>
  113.                     <div style="height:2px;background-color:#b7e7f5"></div>
  114.                 </div>
  115.                
  116.                
  117.                 <!-- /// INTRODUCTION /// -->
  118.                 <div class="card p-3 mb-3" style="
  119.                    min-height:30px;
  120.                    border-width:3px;
  121.                    border-radius:0px 30px;
  122.                    overflow:hidden;
  123.                    background-color:rgba(255,255,255,0.7);
  124.                    border-color:#f2f8fa;
  125.                    color:#000000
  126.                    ">
  127.                
  128.                     <div class="row">
  129.                        
  130.                         <!--blurb-->
  131.                         <div class="col-md-7 order-2 order-lg-1">
  132.                             <div>
  133.                                
  134.                                 <hr class="d-block d-md-none">
  135.                                
  136.                                 <p>This section expands!</p>
  137.                                 <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis sollicitudin elit sed tellus blandit viverra sed eget odio. Donec accumsan tempor lacus, et venenatis elit feugiat non. Duis porta eros et velit blandit dapibus. Curabitur ac finibus eros. Duis placerat velit vitae massa sodales, eget mattis nibh pellentesque.</p>
  138.                             </div>
  139.                         </div>
  140.                        
  141.                         <!--basic info-->
  142.                         <div class="col-md-5 order-1 order-md-2">
  143.                             <div class="card px-3" style="
  144.                                border-width:3px;
  145.                                border-radius:30px 0px;
  146.                                background-color: ;
  147.                                color:#ffffff;
  148.                                background-color:#43b0d1;
  149.                                border-color:#b7e7f5;
  150.                                font-style:italic;
  151.                                font-size:1.25em
  152.                                ">
  153.                                
  154.                                 GENDER
  155.                             </div>
  156.                             <div class="px-3 mb-2">
  157.                                 Text (pro/nouns)
  158.                             </div>
  159.                            
  160.                            
  161.                             <div class="card px-3" style="
  162.                                border-width:3px;
  163.                                border-radius:30px 0px;
  164.                                background-color: ;
  165.                                color:#ffffff;
  166.                                background-color:#43b0d1;
  167.                                border-color:#b7e7f5;
  168.                                font-style:italic;
  169.                                font-size:1.25em
  170.                                ">
  171.                                 RACE/SPECIES
  172.                             </div>
  173.                             <div class="px-3 mb-2">
  174.                                 Text
  175.                             </div>
  176.                            
  177.                             <div class="card px-3" style="
  178.                                border-width:3px;
  179.                                border-radius:30px 0px;
  180.                                background-color: ;
  181.                                color:#ffffff;
  182.                                background-color:#43b0d1;
  183.                                border-color:#b7e7f5;
  184.                                font-style:italic;
  185.                                font-size:1.25em
  186.                                ">
  187.                                
  188.                                 BIRTHDAY
  189.                             </div>
  190.                             <div class="px-3 mb-2">
  191.                                 00/00
  192.                             </div>
  193.                            
  194.                            
  195.                         </div>
  196.                     </div>
  197.                    
  198.                    
  199.                     <!-- /// MUSIC /// -->
  200.                     <div class="card px-3 mt-3" style="
  201.                        min-height:30px;
  202.                        border-width:3px;
  203.                        border-radius:0px 30px;
  204.                        
  205.                        font-style:italic;
  206.                        overflow:hidden;
  207.                        color:#ffffff;
  208.                        background-color:#43b0d1;
  209.                        border-color:#b7e7f5
  210.                    ">
  211.                        
  212.                         <!-- HOW TO CHANGE THE LINK/SONG
  213.                            - Go to youtube and find the song you want to use
  214.                            - the page link has a string of random letters & numbers at the end of it.
  215.                                (eg: https://www.youtube.com/watch?v= [here] )
  216.                            - copy that string of letters and paste it between embed/ and ?controls-0 in the embed link
  217.                                (eg: src="https://www.youtube-nocookie.com/embed/ [here] ?controls=0" )
  218.                         -->
  219.                    
  220.                         <iframe src="https://www.youtube-nocookie.com/embed/uMI1gpsiHsM?controls=0"
  221.                        frameborder="0"
  222.                        style="position:absolute;left:0px;top:-80px;width:100px;height:200px;z-index:1;opacity:0.001"></iframe>
  223.                        
  224.                        
  225.                         <!--song info-->
  226.                         <p class="d-flex flex-wrap align-items-center" style="font-size:2em">
  227.                             <i class="fa-regular fa-compact-disc"></i>
  228.                             <span class="ml-auto">HIGH - RAM  <i class="fa-regular fa-wind"></i></span>
  229.                         </p>
  230.                        
  231.                        
  232.                     </div>
  233.                     <!-- /// END MUSIC /// -->
  234.                
  235.                
  236.                 </div>
  237.                 <!-- /// END INTRODUCTION /// -->
  238.                
  239.                
  240.                 <hr>
  241.                
  242.                 <!-- /// BACKGROUND/// -->
  243.                
  244.                     <!--section header-->
  245.                 <div class="card px-2 py-1 mb-3" style="
  246.                    min-height:30px;
  247.                    border-width:3px;
  248.                    border-radius:30px 0px;
  249.                    font-size:2em;
  250.                    font-style:italic;
  251.                    overflow:hidden;
  252.                    background-color:#43b0d1;
  253.                    border-color:#b7e7f5;
  254.                    color:#ffffff
  255.                ">
  256.                     <span><i class="fa-regular fa-wind fa-rotate-180"></i> BACKGROUND</span>
  257.                     <div style="height:2px;background-color:#b7e7f5"></div>
  258.                 </div>
  259.                
  260.                
  261.                 <div class="row align-items-center">
  262.                    
  263.                     <!--image-->
  264.                     <div class="col-md-4">
  265.                         <div class="card bg-faded" style="
  266.                            min-height:30px;
  267.                            border-width:3px;
  268.                            border-radius:0px 30px;
  269.                            font-style:italic;
  270.                            text-align:right;
  271.                            overflow:hidden;
  272.                            min-height:350px;
  273.                            background-image:url(https://images.unsplash.com/photo-1525109556882-cb01f87f4552?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1974&q=80);
  274.                            background-size:cover;
  275.                            background-position:center;
  276.                            border-color:#f2f8fa;
  277.                        ">
  278.                            
  279.                             <!--image credit-->
  280.                             <span class="text-white" style="font-size:1.25em;position:absolute;right:10px;top:5px;text-shadow:1px 1px 3px #000000;letter-spacing:2px">
  281.                            
  282.                                 <a href="https://unsplash.com/photos/D5G6TGm6W1I" target="_blank"><i class="fa-solid fa-circle text-white" data-toggle="tooltip" title="img - unsplash"></i></a>
  283.                                
  284.                             </span>
  285.                            
  286.                         </div>
  287.                     </div>
  288.                    
  289.                     <!--blurb-->
  290.                     <div class="col-md-8">
  291.                         <div class="card p-3" style="
  292.                            min-height:30px;
  293.                            border-width:3px;
  294.                            border-radius:30px 0px;
  295.                            overflow:hidden;
  296.                            background-color:rgba(255,255,255,0.7);
  297.                            border-color:#f2f8fa;
  298.                            color:#000000
  299.                            ">
  300.                            
  301.                             <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla id dui vel mauris luctus aliquam. In felis orci, imperdiet eget sollicitudin a, convallis a diam. Maecenas velit magna, suscipit et arcu eget, sodales vulputate lorem.</p>
  302.                            
  303.                             <p>Nulla euismod, nunc ac dapibus molestie, enim lorem bibendum ipsum, ut molestie velit eros et augue. Nam lobortis sollicitudin ex vitae volutpat. Nullam eu urna et dolor condimentum elementum nec a odio. Nunc tincidunt augue sed dui sollicitudin, ut sodales nisl rutrum. Sed vel rutrum nunc, quis venenatis orci.</p>
  304.                            
  305.                             <p> Sed quis lectus enim. Proin tristique volutpat fringilla. Vivamus bibendum erat odio, non placerat eros bibendum eu. Sed sagittis enim quis massa malesuada ornare.</p>
  306.                            
  307.                         </div>
  308.                     </div>
  309.                    
  310.                 </div>
  311.                 <!-- /// END BACKGROUND/// -->
  312.                
  313.                 <hr>
  314.                
  315.                 <!-- /// TRIVIA /// -->
  316.                 <div class="row align-items-center">
  317.                    
  318.                     <!--blurb-->
  319.                     <div class="col-md-8">
  320.                         <div class="card p-3" style="
  321.                            min-height:30px;
  322.                            border-width:3px;
  323.                            border-radius:30px 0px;
  324.                            overflow:hidden;
  325.                            background-color:rgba(255,255,255,0.7);
  326.                            border-color:#f2f8fa;
  327.                            color:#000000
  328.                            ">
  329.                            
  330.                             <p> <i class="fa-solid fa-plane"></i> Lorem Ipsum is simply dummy text of the printing and typesetting industry.</p>
  331.                            
  332.                             <p> <i class="fa-solid fa-plane"></i> Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.</p>
  333.                            
  334.                             <p> <i class="fa-solid fa-plane"></i>  It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.</p>
  335.                            
  336.                             <p> <i class="fa-solid fa-plane"></i>  It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.</p>
  337.                         </div>
  338.                     </div>
  339.                    
  340.                     <!--image-->
  341.                     <div class="col-md-4">
  342.                         <div class="card bg-faded" style="
  343.                            min-height:30px;
  344.                            border-width:3px;
  345.                            border-radius:0px 30px;
  346.                            font-style:italic;
  347.                            text-align:right;
  348.                            overflow:hidden;
  349.                            min-height:350px;
  350.                            background-image:url(https://images.unsplash.com/photo-1621924123226-01ca69c08e29?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=687&q=80);
  351.                            background-size:cover;
  352.                            background-position:center;
  353.                            border-color:#f2f8fa;
  354.                        ">
  355.                            
  356.                             <!--image credit-->
  357.                             <span class="text-white" style="font-size:1.25em;position:absolute;right:10px;top:5px;text-shadow:1px 1px 3px #000000;letter-spacing:2px">
  358.                            
  359.                                 <a href="https://unsplash.com/photos/FmVgX6jK9jI" target="_blank"><i class="fa-solid fa-circle text-white" data-toggle="tooltip" title="img - unsplash"></i></a>
  360.                                
  361.                             </span>
  362.                    
  363.                         </div>
  364.                     </div>
  365.                    
  366.                 </div>
  367.                 <!-- /// ENDTRIVIA /// -->
  368.                
  369.                
  370.                 <hr>
  371.                
  372.                
  373.                 <!-- /// LINKS /// -->
  374.                
  375.                     <!--header-->
  376.                 <div class="card px-2 py-1 mb-3" style="
  377.                    min-height:30px;
  378.                    border-width:3px;
  379.                    border-radius:30px 0px;
  380.                    font-size:2em;
  381.                    font-style:italic;
  382.                    overflow:hidden;
  383.                    background-color:#43b0d1;
  384.                    border-color:#b7e7f5;
  385.                    color:#ffffff
  386.                ">
  387.                     <span><i class="fa-regular fa-wind fa-rotate-180"></i> LINKS</span>
  388.                     <div style="height:2px;background-color:#b7e7f5"></div>
  389.                 </div>
  390.                    
  391.                    
  392.                     <!-- /// LINK 1 /// -->
  393.                 <div class="row">
  394.                    
  395.                     <!--image-->
  396.                     <div class="col-md-3">
  397.                         <div class="card bg-faded mb-3 mx-auto" style="
  398.                            border-width:3px;
  399.                            border-radius:0px 30px;
  400.                            font-size:2.5em;
  401.                            font-style:italic;
  402.                            text-align:right;
  403.                            overflow:hidden;
  404.                            min-height:150px;
  405.                            max-width:150px;
  406.                            background-image:url(https://images.unsplash.com/photo-1498019559366-a1cbd07b5160?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=2058&q=80);
  407.                            background-size:cover;
  408.                            background-position:center;
  409.                            border-color:#f2f8fa;
  410.                        "></div>
  411.                     </div>
  412.                    
  413.                    
  414.                     <div class="col-md-9">
  415.                        
  416.                         <!--link-->
  417.                         <div class="card px-3 mb-2" style="
  418.                            border-width:3px;
  419.                            border-radius:30px 0px;
  420.                            background-color: ;
  421.                            color:#ffffff;
  422.                            background-color:#43b0d1;
  423.                            border-color:#b7e7f5;
  424.                            font-style:italic;
  425.                            font-size:1.5em
  426.                            ">
  427.                            
  428.                             <p class="d-flex flex-wrap">
  429.                                 <a href="#" style="color:#ffffff">CHARACTER NAME</a>
  430.                                 <span class="ml-auto">- STATUS</span>
  431.                             </p>
  432.                            
  433.                         </div>
  434.                        
  435.                         <!--blurb-->
  436.                         <div class="card px-3 py-2 mb-3" style="
  437.                            min-height:30px;
  438.                            border-width:3px;
  439.                            border-radius:0px 30px;
  440.                            overflow:hidden;
  441.                            background-color:rgba(255,255,255,0.7);
  442.                            border-color:#f2f8fa;
  443.                            color:#000000
  444.                            ">
  445.                            
  446.                             <p> Relationship notes. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis sollicitudin elit sed tellus blandit viverra sed eget odio. Donec accumsan tempor lacus, et venenatis elit feugiat non. Duis porta eros et velit blandit dapibus.</p>
  447.                         </div>
  448.                     </div>
  449.                    
  450.                 </div>
  451.                     <!-- /// END LINK 1 /// -->
  452.                
  453.                
  454.                     <!-- /// LINK 2 /// -->
  455.                 <div class="row">
  456.                    
  457.                     <!--image-->
  458.                     <div class="col-md-3 order-1 order-md-2">
  459.                         <div class="card bg-faded mb-3 mx-auto" style="
  460.                            border-width:3px;
  461.                            border-radius:0px 30px;
  462.                            font-size:2.5em;
  463.                            font-style:italic;
  464.                            text-align:right;
  465.                            overflow:hidden;
  466.                            min-height:150px;
  467.                            max-width:150px;
  468.                            background-image:url(https://images.unsplash.com/photo-1498019559366-a1cbd07b5160?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=2058&q=80);
  469.                            background-size:cover;
  470.                            background-position:center;
  471.                            border-color:#f2f8fa;
  472.                        "></div>
  473.                     </div>
  474.                    
  475.                    
  476.                     <div class="col-md-9 order-2 order-md-1">
  477.                        
  478.                         <!--link-->
  479.                         <div class="card px-3 mb-2" style="
  480.                            border-width:3px;
  481.                            border-radius:30px 0px;
  482.                            background-color: ;
  483.                            color:#ffffff;
  484.                            background-color:#43b0d1;
  485.                            border-color:#b7e7f5;
  486.                            font-style:italic;
  487.                            font-size:1.5em
  488.                            ">
  489.                            
  490.                             <p class="d-flex flex-wrap">
  491.                                 <a href="#" style="color:#ffffff">CHARACTER NAME</a>
  492.                                 <span class="ml-auto">- STATUS</span>
  493.                             </p>
  494.                            
  495.                         </div>
  496.                        
  497.                         <!--blurb-->
  498.                         <div class="card px-3 py-2 mb-3" style="
  499.                            min-height:30px;
  500.                            border-width:3px;
  501.                            border-radius:0px 30px;
  502.                            overflow:hidden;
  503.                            background-color:rgba(255,255,255,0.7);
  504.                            border-color:#f2f8fa;
  505.                            color:#000000
  506.                            ">
  507.                            
  508.                             <p> Relationship notes. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis sollicitudin elit sed tellus blandit viverra sed eget odio. Donec accumsan tempor lacus, et venenatis elit feugiat non. Duis porta eros et velit blandit dapibus.</p>
  509.                         </div>
  510.                     </div>
  511.                    
  512.                 </div>
  513.                     <!-- /// END LINK 2 /// -->
  514.                
  515.                
  516.                     <!-- /// LINK 3 /// -->
  517.                 <div class="row">
  518.                    
  519.                     <div class="col-md-3">
  520.                         <div class="card bg-faded mb-3 mx-auto" style="
  521.                            border-width:3px;
  522.                            border-radius:0px 30px;
  523.                            font-size:2.5em;
  524.                            font-style:italic;
  525.                            text-align:right;
  526.                            overflow:hidden;
  527.                            min-height:150px;
  528.                            max-width:150px;
  529.                            background-image:url(https://images.unsplash.com/photo-1498019559366-a1cbd07b5160?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=2058&q=80);
  530.                            background-size:cover;
  531.                            background-position:center;
  532.                            border-color:#f2f8fa;
  533.                        "></div>
  534.                     </div>
  535.                    
  536.                     <div class="col-md-9">
  537.                        
  538.                         <div class="card px-3 mb-2" style="
  539.                            border-width:3px;
  540.                            border-radius:30px 0px;
  541.                            background-color: ;
  542.                            color:#ffffff;
  543.                            background-color:#43b0d1;
  544.                            border-color:#b7e7f5;
  545.                            font-style:italic;
  546.                            font-size:1.5em
  547.                            ">
  548.                            
  549.                             <p class="d-flex flex-wrap">
  550.                                 <a href="#" style="color:#ffffff">CHARACTER NAME</a>
  551.                                 <span class="ml-auto">- STATUS</span>
  552.                             </p>
  553.                            
  554.                         </div>
  555.                         <div class="card px-3 py-2 mb-3" style="
  556.                            min-height:30px;
  557.                            border-width:3px;
  558.                            border-radius:0px 30px;
  559.                            overflow:hidden;
  560.                            background-color:rgba(255,255,255,0.7);
  561.                            border-color:#f2f8fa;
  562.                            color:#000000
  563.                            ">
  564.                            
  565.                             <p> Relationship notes. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis sollicitudin elit sed tellus blandit viverra sed eget odio. Donec accumsan tempor lacus, et venenatis elit feugiat non. Duis porta eros et velit blandit dapibus.</p>
  566.                         </div>
  567.                     </div>
  568.                    
  569.                 </div>
  570.                     <!-- /// END LINK 3 /// -->
  571.                
  572.                 <!-- /// END LINKS /// -->
  573.                
  574.             </div>
  575.         </div>
  576.         <!-- /// END INFO SECTION /// -->
  577.        
  578.        
  579.     </div>
  580.    
  581.    
  582.     <!--Credit. You may move it, but please do not delete/remove-->
  583.     <div class="card px-3 my-3" style="
  584.        min-height:30px;
  585.        border-width:3px;
  586.        border-radius:30px 0px;
  587.        overflow:hidden;
  588.        background-color:rgba(255,255,255,0.7);
  589.        border-color:#f2f8fa;
  590.        color:#000000
  591.        ">
  592.         <p style="text-align:right">HTML by <a href="https://toyhou.se/21699840" style="color:#2f8dc2"><i class='fa-solid fa-heart'></i> Jade-Everstone</a> // bg - <a href="https://unsplash.com/photos/p-k8TlkgdgA" style="color:#2f8dc2" target="_blank">Unsplash</a></p>
  593.     </div>
  594.    
  595.    
  596. </div>
Advertisement
Add Comment
Please, Sign In to add comment
Public Pastes
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!