@font-face {
    font-family: 'myFirstFont';
    src: url("../fonts/helveticaneue-medium-webfont.eot")format('embedded-opentype');
}
@font-face {
    font-family:' myFirstFontBold';
    src: url("../fonts/HelveticaNeue-Bold.woff");
}
@font-face {
    font-family: 'myFirstFontMed';
    src: url("../fonts/helveticaneue-medium-webfont.eot");
}
@font-face {
	font-family: 'UTM';
	src: url('../fonts/utm_neo_sans_intel.eot') format('embedded-opentype');
	src: local(''),
	url('../fonts/utm_neo_sans_intel.woff') format('woff'), url('../fonts/utm_neo_sans_intel.ttf') format('truetype'), url('../fonts/utm_neo_sans_intel.svg') format('svg');
	
}
@font-face {
	font-family: 'UTM-Neo-Sans-IntelBold';
	src: url("../fonts/UTM-Neo-Sans-IntelBold.eot?v=1.1.0");
	src: url("../fonts/UTM-Neo-Sans-IntelBold.eot?#iefix&v=1.1.0") format("embedded-opentype"), url("../fonts/UTM-Neo-Sans-IntelBold.woff2?v=1.1.0") format("woff2"), url("../fonts/UTM-Neo-Sans-IntelBold.woff?v=1.1.0") format("woff"), url("../fonts/UTM-Neo-Sans-IntelBold.ttf?v=1.1.0") format("truetype"), url("../fonts/UTM-Neo-Sans-IntelBold.svg?v=1.1.0#Light") format("svg");
	font-weight: 300;
	font-style: normal; 
}

body {
    color: #333 !important;
   font-family: 'UTM', Arial, Tahoma !important;
    font-size: 14px !important;
    line-height: 24px !important;
}



@media only screen and (max-width: 767px) {


}

@media only screen and (min-width: 768px) {
#todo{ font-size:20px;font-family: myFirstFont !important;color: #666;
  text-shadow: 0 1px #fff, -1px 0 #fff, -1px 2px #fff, -2px 1px #fff, -2px 3px #fff, -3px 2px #fff; margin-bottom:1em}
  
  #bounce {
  font-size: 32px;
  font-family: UTM-Neo-Sans-IntelBold;
  text-align: left;
  color: #333;
  font-weight: bold;
  text-shadow: 0 1px #fff, -1px 0 #fff, -1px 2px #fff, -2px 1px #fff, -2px 3px #fff, -3px 2px #fff, -3px 4px #fff, -4px 3px #fff, -4px 5px #fff, -5px 4px #fff;margin-bottom:15px
}
}
@keyframes fadeInLeft {
    from {
        opacity: 0;
        transform: translateX(-60px);
    }

    to {
        opacity: 1;
        transform: translateX(0);
    }
}
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(50px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}


@keyframes fadeInRight {
    from {
        opacity: 0;
        transform: translateX(60px);
    }

    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes floating {
    0%,100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-12px);
    }
}

.animate-fadeInLeft {
    animation: fadeInLeft 1s ease-out forwards;
}

.animate-fadeInRight {
    animation: fadeInRight 1.2s ease-out forwards;
}

.animate-floating {
    animation: floating 4s ease-in-out infinite;
}

.animate-fadeInUp {
    opacity: 0;
    animation: fadeInUp 0.8s ease-out forwards;
}
@keyframes rotateInUpRight {
    0% {
        opacity: 0;
        transform-origin: right bottom;
        transform: translateY(120px) rotate(45deg);
    }

    100% {
        opacity: 1;
        transform-origin: right bottom;
        transform: translateY(0) rotate(0deg);
    }
}

.animate-rotateInUpRight-delay {
    opacity: 0;
    animation: rotateInUpRight 0.8s ease-out 0.8s forwards;
}
.animate-rotateInUpRight-delay-2 {
    opacity: 0;
    animation: rotateInUpRight 1.2s ease-out 0.8s forwards;
}
.paging {clear:both; margin-bottom:20px; margin-top:20px; text-align:center;}
.paging a  { 
	 color:#000000;  
	 text-decoration:none; border:1px solid #ddd; padding:10px 15px; text-align:center; margin-right:5px; }
.paging a:hover{ 
	color:#fff; text-decoration:underline; background-color:#ED1D24}  
.paging .current  { 
	background-color:#ED1D24; color:#fff; 
	padding:10px 15px; text-align:centerfont-weight:bold}
	
/* ==========================
   ARTICLE CONTENT
========================== */

/* Heading */

.prose h1{
    font-size:2rem;      /* 40px */
    font-weight:700;
    line-height:1.5;
    margin:0.5em 0 .5em;
}

.prose h2{
    font-size:1.75rem;        /* 32px */
    font-weight:700;
    line-height:1.3;
    margin:0.5em 0 .5em;
}

.prose h3{
    font-size:1.5rem;     /* 28px */
    font-weight:600;
    line-height:1.35;
    margin:0.5em 0 .5em;
}

.prose h4{
    font-size:1.25rem;      /* 24px */
    font-weight:600;
    line-height:1.4;
    margin:0.5em 0 .5em;
}

.prose h5{
    font-size:1rem;     /* 20px */
    font-weight:600;
    line-height:1.4;
    margin:1em 0 .6em;
}

.prose h6{
    font-size:1rem;    /* 18px */
    font-weight:600;
    line-height:1.5;
    margin:0.5em 0 .5em;
}

/* Paragraph */

.prose p{
    margin-bottom:1rem;
    line-height:1.8;
}

/* Link */

/*.prose a{
    color:#2563eb;
    text-decoration:underline;
}

.prose a:hover{
    color:#1d4ed8;
}
*/
/* Strong */

.prose strong{
    font-weight:700;
}

/* Italic */

.prose em{
    font-style:italic;
}

/* List */

.prose ul,
.prose ol, .table_of_content ul{
    margin:1rem 0;
    padding-left:2rem;
}

.prose ul, .table_of_content ul{
    list-style:disc;
}

.prose ol{
    list-style:decimal;
}

.prose li, .table_of_content li{
    margin-bottom:.5rem;
    line-height:1.8;
}

/* Image */

.prose img{
    max-width:100%;
    height:auto;
    display:block;
    margin:1rem auto;
    
}

/* Table */

.prose table{
    width:100%;
    border-collapse:collapse;
    margin:1.5rem 0;
}

.prose table th,
.prose table td{
    border:1px solid #d1d5db;
    padding:10px 15px;
}

.prose table th{
    /*background:#f3f4f6;*/
    font-weight:700;
}

/* Blockquote */

.prose blockquote{
    border-left:4px solid #2563eb;
    padding:12px 20px;
    margin:1.5rem 0;
    background:#f8fafc;
    font-style:italic;
}

/* Code */

.prose code{
    background:#f3f4f6;
    padding:2px 6px;
    border-radius:4px;
}

.prose pre{
    overflow:auto;
    padding:16px;
    background:#111827;
    color:#fff;
    border-radius:8px;
}

/* Iframe (YouTube) */

.prose iframe{
    width:100%;
    aspect-ratio:16/9;
    border:0;
    margin:1rem 0;
}

/* Horizontal line */

.prose hr{
    margin:2rem 0;
    border:0;
    border-top:1px solid #d1d5db;
}

/* Responsive */

@media (max-width:768px){

    .prose h1{
        font-size:2rem;
    }

    .prose h2{
        font-size:1.75rem;
    }

    .prose h3{
        font-size:1.5rem;
    }

    .prose h4{
        font-size:1.25rem;
    }

    .prose h5{
        font-size:1.125rem;
    }

    .prose h6{
        font-size:1rem;
    }

}	
audio, canvas, embed, iframe, img, object, svg, video {
	display:initial !important;	
}