texxs

<!--  Nothing is pefect  -->
<!--  There is an exception to every rule, except this one  -->
<!--  Read notes and info after code  -->

<!--  //////////////////////////////// -->

<video width="400" height="300" controls="controls" poster="video.jpg"> 
	
	<!-- video format depending on what the browser supports -->
	<source src="video.mp4" type="video/mp4" />

texxs

Some of these are kinda hard to find out there, like this one... a "Half-width downward arrow" . . . 

￬

texxs

☰

texxs

  body  {
    background: linear-gradient(-45deg,  #cbc49f, #ba8f02, #23a6d5,  #34E89E);
    background-repeat: no-repeat;
    background-attachment: fixed;
    animation: gradient 35s ease infinite;
    height: 100vh;
 }
/*/////  This was written to be applied to the body tag but in theeory will work on any block element.   //////*/

@keyframes gradient {

texxs

//  Meant for use on a body but you can use it on any element where a background color is appropriate

	background-color: #960816;
	background-image: repeating-linear-gradient(45deg, transparent, transparent 35px, #B7420B 35px, #B7420B 70px); 
  /*
  note this background can be glitchy on pages where the content doesn't fill the screen.
  On those page consider a gradient or a solid color background or even a tradional background image.
  */
  

texxs

//  First one  . . . sooo fancy:

hr  {
  border: 0;
  height: 1px;
  background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0));
  background-color: #7DD181;
  width: 90%;
  margin-left: auto;
  margin-right: auto;

texxs

.ghost-button {
  display: inline-block;
  width: 200px;   /*  replace with left and right padding for bigger buttons  */
  padding: 8px;
  color: #fff;
  border: 2px solid #fff;
  text-align: center;
  outline: none;
  text-decoration: none;

texxs

h1 {
   text-indent:-9999px;
   margin:0 auto;
   width:400px;
   height:100px;
   background:transparent url("images/logo.jpg") no-repeat scroll;
}

In the HTML doc you put the keyphrase you want to pimp inside the h1 html tag where you want the logo displayed (be sure the h1 tag is inside a container that positions it or it won't be visible) and only the logo will display, not the text (it will be off screen to the left about 9999 pixels.

texxs

#border-image-style {
   border-width:15px;
   /* 3 types of border exist repeated, rounded or stretched (repeat / round / stretch) */
   -moz-border-image:url(border.png) 30 30 stretch ;
   -webkit-border-image:url(border.png) 30 30 stretch;
}

texxs

if(function_exists("register_field_group"))
{
	register_field_group(array (
		'id' => 'acf_local-video-page-options',
		'title' => 'Local Video Page Options',
		'fields' => array (
			array (
				'key' => 'field_577830c13dfc0',
				'label' => 'Video Choice',
				'name' => 'video_choice',