body {
	background			: #EEEEEE;
	margin				: 0;
	font-family			: Segoe UI Light;
}

a {
	text-decoration		: none;
}

hr {
	border				: 0;
	background			: #DEDEDE;
	height				: 2px;
}

header {
	text-align			: center;
	color				: #232323;
	background-color	: #FFFFFF;
	padding				: 30px 0px 10px 0px;
	border-radius		: 5px;
	border				: 1px solid #F0F0F0;
	margin-bottom		: 10px;
}

header .judul {
	font-size			: 17pt;
}

header .deskripsi {
	font-size			: 11pt;
}

.logo-left {
	float				: left;
	margin-left			: 100px;
	margin-top			: -10px;
	width				: 75px;
	height				: 75px;
}

.logo-right {
	float				: right;
	margin-right		: 100px;
	margin-top			: -10px;
	width				: 75px;
	height				: 75px;
}

.wrap {
	width				: 950px;
	margin				: 10px auto;
}

.blog {
	float				: left;
	width				: 950px;
}

.content {
	color				: #232323;
	
	background-color	: #FFFFFF;
	padding				: 20px 10px;
	border-radius		: 5px;
	border				: 1px solid #F0F0F0;
	margin-bottom		: 10px;
}

.content h3 {
	padding				: 0;
	margin				: 0 0 15px;
	font-weight			: normal;
	color				: #666666;
	font-family			: Segoe UI Light;
	text-align			: center;
}

.content p:last-child {
	margin				: 0;
}

.content .readmore {
	color				: #000000;
	transition			: all 0.5s ease;
	text-decoration		: none;
	font-weight			: 700;
}

.content .readmore:hover {
	margin-left			: 10px;
}

.post-info {
	float				: right;
	font-size			: 12px;
	margin				: -10px 0 15px;
	text-transform		: uppercase;
}


article{
	width				: 100%;
	height				: auto;	
	position			: relative;
	font-family			: Segoe UI Light;
	background-color	: #FFFFFF;
}

.post-title{
	font-size			: 25px;
	text-align			: center;
	padding-top			: 20px;
}

.post-form{
	width				: 60%;
	margin				: auto;
	text-align			: center;
	padding-top			: 20px;
}

.textarea{
	width				: 100%;
	height				: 50px;
	border				: 1px solid #BDBDBD;
	text-align			: center;
	font-family         : Segoe UI Light;
	font-size           : 14px;
}

.button{
	width				: 100%;
	height				: 50px;
}

footer {
	float				: left;
	width				: 100%;
	height				: auto;	
	position			: relative;
	font-family			: Segoe UI Light;
	background-color	: #FFFFFF;
	border-radius		: 5px;
	padding				: 0px 0px 0px 0px;
	text-align			: center;
	padding				: 20px 0px 20px 0px;
	margin-bottom		: 20px;
}

.headercard{
	width				: 60%;
	height				: 50px;
	margin				: auto;
	font-family			: Segoe UI Light;
	font-size			: 15px;
	background-color	: #FFFFFF;
	border-collapse		: collapse;
}

.titlecard{
	font-size			: 18px;
	font-weight			: bold;
	float				: center;
	text-align			: center;
}

.identity{
	width				: 60%;
	height				: 100px;
	margin				: auto;
	font-family			: Segoe UI Light;
	font-size			: 15px;
	background-color	: #FFFFFF;
	border-collapse		: collapse;
}

.alert-congrats{
	width				: 60%;
	height				: auto;
	margin				: auto;
	font-family			: Segoe UI Light;
	font-size			: 15px;
	color				: #FFFFFF;
	text-align			: center;
	margin-top			: 20px;
	margin-bottom		: 10px;
	padding-top			: 20px;
	padding-bottom		: 20px;	
	border-radius		: 5px;
	background-color	: #4CAF50;
}

.alert-sorry{
	width				: 80%;
	height				: auto;
	margin				: auto;
	font-family			: Segoe UI Light;
	font-size			: 15px;
	color				: #FFFFFF;
	text-align			: center;
	margin-top			: 20px;
	margin-bottom		: 10px;
	padding-top			: 20px;
	padding-bottom		: 20px;
	border-radius		: 5px;
	background-color	: #DC3545;
}

.alert-warning{
	width				: 60%;
	height				: auto;
	margin				: auto;
	font-family			: Segoe UI Light;
	font-size			: 15px;
	color				: #FFFFFF;
	text-align			: center;
	margin-top			: 20px;
	margin-bottom		: 10px;
	padding-top			: 20px;
	padding-bottom		: 20px;
	border-radius		: 5px;
	background-color	: #FFC107;
}


.information{
	width				: 60%;
	height				: auto;
	margin				: auto;
	font-family			: Segoe UI Light;
	font-size			: 15px;
	color				: #FFFFFF;
	text-align			: center;
	margin-top			: 20px;
	margin-bottom		: 10px;
	padding-top			: 20px;
	padding-bottom		: 20px;	
	border-radius		: 5px;
	background-color	: #17A2B8;
}

.information a{
	color				: #FFFFFF;
	text-decoration		: none;
}

footer{
	width				: 100%;
	height				: auto;	
	margin				: auto;
	position			: relative;
	font-family			: Segoe UI Light;
	font-size			: 12px;
	color				: #000000;
	text-align			: center;
	background-color	: #FFFFFF;
}

#countdown{
	width				: 80%;
	height				: auto;
	margin				: auto;
	font-family			: Segoe UI Light;
	font-size			: 15px;
	color				: #FFFFFF;
	text-align			: center;
	margin-top			: 20px;
	margin-bottom		: 10px;
	padding-top			: 20px;
	padding-bottom		: 20px;	
	border-radius		: 5px;
	background-color	: #4CAF50;
}

.timer{
    text-align          : center;
    text-decoration     : bold;
    font-family         : Segoe UI Light;
    font-size           : 24px;
    
}

.license{
	padding-bottom		: 10px;
}

.founder{
	padding-top 		: 10px;
}

.notification{
	width				: 80%;
	height				: auto;	
	margin				: auto;
	position			: relative;
	font-family			: Segoe UI Light;
	font-size			: 12px;
	color				: #000000;
	text-align			: center;
}

@media screen and (max-width: 960px) {
	
	.header {
		position		: inherit;
	}
	
	.logo-left {
		margin-left		: 50px;
	}
	
	.logo-right {
		margin-right	: 50px;
	}
	
	.wrap {
		width			: 90%;
		margin			: 25px auto;
	}
	
	.blog {
		width			: 100%;
		
	}
	
	.content {
		float			: inherit;
		width			: 100%;
		padding			: 5%;
		background		: #FFFFFF;
	}
	
	.content .readmore:hover {
		margin-left		: 0;
	}
}

@media screen and (max-width: 700px) {
		
	.logo-left {
		margin-top		: -10px;
	}
	
	.logo-right {
		margin-top		: -10px;
	}
}

@media screen and (max-width: 545px) {
	.sidebar {
		display			: none;
	}

	.content {
		margin			: 25px auto;
	}
	
	.logo-left {
		margin-top		: 5px;
	}
	
	.logo-right {
		margin-top		: 5px;
	}
}