/*
Theme Name: Ronald Manual Blog 2021
Theme URI: http://ronaldmanual.com
Author: Ronald Manual
Author URI: http://ronaldmanual.com
Description: A theme specifically created by Ronald Manual for Ronald Manual's personal blog.
Version: 1.0
*/

@import url('https://fonts.googleapis.com/css?family=Poppins:300,400,800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Lora&display=swap');
*{
    margin:0;
}

html{
    height:100%;
}

body{
    margin:0;
    padding:0;
    font-family: Poppins, sans-serif;
    font-weight:300;
    font-size:18pt;
    line-height:36pt;
    background:#fafafa;
      overflow: auto;

}

#container,.container{
	margin:25px auto;
	padding:0;
	clear:both;
}

#container:after,.container:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}


#full-width{
	margin:0 auto;
	padding:0 150px;
	width:calc(100% - 300px);
	clear:both;
}

#sidebar{
	margin:0;
	padding:0 25px;
	width:calc(25% - 50px);
	float:left;
}

#content{
	margin:0;
	padding:0 50px;
	float:right;
	width:	calc(75% - 100px);

}




header{
    margin:0 auto;
    padding:100px 50px 50px 50px;
    background:#e4f1f2;
}    

header:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

    
header h1{
    /*margin:0;*/
    padding:0;
    font-size:48pt;
    text-align:center;
    text-transform:uppercase;
    /*-height:1;*/
   -webkit-animation: fadein 5s; /* Safari, Chrome and Opera > 12.1 */
       -moz-animation: fadein 5s; /* Firefox < 16 */
        -ms-animation: fadein 5s; /* Internet Explorer */
         -o-animation: fadein 5s; /* Opera < 12.1 */
            animation: fadein 5s;
            
    letter-spacing:24px;
    width:100%;
    border-bottom: 1px solid #000;       
    line-height:0.1em;
    margin:10px 0 20px;
        text-align: center;

}


header h1 span { padding:0 10px 0 24px; background:#e4f1f2;}

header h2{
    margin:0;
    padding:0;
    font-size:50%;
    text-align:center;
    text-transform:uppercase;
    font-weight:400;
        letter-spacing:10px;
    text-align: center;

   -webkit-animation: fadein 7s; /* Safari, Chrome and Opera > 12.1 */
       -moz-animation: fadein 7s; /* Firefox < 16 */
        -ms-animation: fadein 7s; /* Internet Explorer */
         -o-animation: fadein 7s; /* Opera < 12.1 */
            animation: fadein 7s;
}


nav ul{
	text-align:center;
	list-style-type:none;
	   -webkit-animation: fadein 10s; /* Safari, Chrome and Opera > 12.1 */
       -moz-animation: fadein 10s; /* Firefox < 16 */
        -ms-animation: fadein 10s; /* Internet Explorer */
         -o-animation: fadein 10s; /* Opera < 12.1 */
            animation: fadein 10s;
}
nav li{
	display:inline;
}
nav li a:link,nav  li a:visited,nav li a:active{
	margin:0 5px;
	padding:10px 25px;
	font-weight:400;
	text-decoration:none;
	text-transform:uppercase;
	font-size:80%;
}

nav li a:hover{
    background:#000;
    color:#fff;
}






p{
    margin:10px 0 25px 0;
}


@keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Firefox < 16 */
@-moz-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Safari, Chrome and Opera > 12.1 */
@-webkit-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Internet Explorer */
@-ms-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Opera < 12.1 */
@-o-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

a{
    color:#000;
    text-decoration:none;

}         
a:hover{
    text-decoration:underline;
}

#footer{
	margin:10px 0 0 0;
	padding:10px 0 20px;
	clear:both;
	background:#383838;
	border-top:1px solid #111;
}

#footer-container{
	margin:0 auto;
	padding:0;
	clear:both;
}

#footer-disclaimer{
	margin:25px 0 0;
	padding:0 20px;
	height:33px;
	float:left;
	font-size:12px;
	color:#929292;
	line-height:1;
	font-weight:400;
}

#footer-credits{
	margin:20px 0 0;
	padding:0 20px;
	height:33px;
	float:right;
	font-weight:400;
}

#footer:after {
	content:" ";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}
#footer-credits ul{
	margin:0;
	padding:0;
	float:right;
	list-style-type:none;
}

#footer-credits li{
	margin:0 5px;
	padding:0;
	float:left;
	font-size:12px;
	font-weight:400;
	color:#929292;
}

#footer-credits a:link, #footer-credits a:visited, #footer-credits a:active{
	margin:0;
	padding:0;
	color:#929292;
	text-decoration:none;
	}


#footer-credits a:hover{
	text-decoration:underline;
}



		
.post-meta{
	margin:0;
	padding:0 0 8px;
	border-bottom:8px solid #bababa;
	font-size:20x;
	font-weight:700;
	vertical-align:middle;
	}

.post-meta h2 a:link,.post-meta h2 a:active,.post-meta h2 a:visited{
	color:inherit;
}
	
.author a:link,.author a:active, .author a:visited{
	color:#d7731a;
	text-decoration:none;
	}
	
.date a:link,.date a:active, .date a:visited{
	color:#118a01;
	text-decoration:none;
	}
	
.category a:link,.category a:active,.category a:visited{
	color:#a02430;
	text-decoration:none;
	}

.post-meta a:hover{
	border-bottom:1px solid #aaa;
	text-decoration:none;
}

.post-hr{
	margin:30px 0;
	padding:0;
	clear:both;
	height:25px;
	background:#bababa;
}


.bullet{
	margin:0 5px;
	padding:0 0 6px;
	font-size:16px;
	color:#c1c1c1;
	vertical-align:middle;
	height:14px;
}


a.more-link:link,a.more-link:active,a.more-link:visited{
	margin:0;
	padding:5px 15px;
	float:right;
	font-weight:700;
	background:#2E8BA2;
	color:#fff;
	display:block;
	font-size:14px;
	text-decoration:none;
}

a.more-link:hover{
	background:#398091;
}