YouTube Theme Post

Why give out your phone number to anyone when you can give out your virtual number to everyone! Try Call Me Private today!


Home

YouTube theme-styled post.

Write your text in a content box.

Add a YouTube button.

Post


Code:
<i class=\"fa fa-youtube-square fa-2x\"></i>

<div class=\"yttab\">Home</div>
<br class=\"clear\">
<p class=\"ytbox\">YouTube theme-styled post.

Write your text in a content box.

Add a YouTube button.

<a href=\"http://mypost.io/post/youtube-theme\" class=\"ytbtn\">Post</a>
</p>
CSS:

/* Default YouTube CSS */
body {
font-family: Arial, sans-serif;
font-size: 12px;
background-color: #f1f1f1;
color: #000;
margin: 0;
}

/* Default Anchor Style */
body a {
color:#167ac6;
outline-style:none;
text-decoration:none;
font-size:11px;
font-weight:700;
}

h1 {
color:#000;
padding:10px;
font-size:2em;
font-weight:700;
}

/* YouTube Tab Style */
.yttab {
padding:8px;
background-color:#cc181e;
color:#fff;
font-weight:700;
float:left;
margin-right:4px;
text-decoration:none;
display:inline-block;
clear: both;
}

.yttab:hover {
background-color: #222;
color:#fff;
text-decoration:none;
cursor:hand;
}

.ytbox {
margin: 0 0 10px;
padding: 10px;
background:#fff;
border: 1px #ccc;
box-shadow: 0 1px 2px rgba(0,0,0,.1)
}

.ytbtn {
background: #167ac6;
color:#fff;
border:1px #167ac6 solid;
padding:5px;
border-radius: 3px;
display:inline-block;
}

.ytbtn:hover {
color:#fff;
text-decoration:none;
}

/* Style MyPost Comments */
.formcontainer {
background:#fff;
}

.author {
background:#fff;
}

.nocomments {
background:#cc181e;
color:#fff;
}
.content {
background:none;
}
/* YouTube Font Awesome Icon */
i.fa.fa-youtube-square.fa-2x {
color: #c4302b;
}