@charset "utf-8";

html{ 
	box-sizing: border-box;
}

*, *:before, *:after {
	box-sizing: inherit;
}

/* Fonts */

p{
	font-family: sans-serif;
    font-size: 1.2em;
	color: #151515
}

li {
	font-family: sans-serif;
    font-size: 1em;
	color:#151515
	
}

h1   {
    font-family: 'MV Boli';
	font-weight: 900;
    font-size: 5em;
    float: right;
	color: #151515
}

h2   {
    font-family: sans-serif;
    font-weight: 900;
    font-size: 1.9em;
	color: #151515
}

h5{
	font-family: sans-serif ;
    font-weight: 900;
    font-size: 1.5em;
	color: #151515
}

/* Buttons */

a.btn { font-size: 1.2em; text-decoration: none; color: #000; border: 1px solid #000; padding: 4px 15px; transition: background-color .5s; float: right }
a.btn:hover { background-color: rgba(0,0,0,.3); color: #000;}

a.btn_show { 
	font-size: 1.1em; 
	text-decoration: none; 
	color: #000; 
	border: 1px solid #000; 
	padding: 4px 15px;
	transition: background-color .5s; 
	
}
a.btn_show:hover { background-color: rgba(0,0,0,.3); color: #000;}





header {
    text-align: center;
    margin-top: 80px;
    margin-right: 80px;
    margin-bottom: 80px;
    margin-left: 80px;
	height: 10px;
}

body nav a {
    color: #00A9FF;
    text-decoration: none;
}

footer  {
    font-size: x-small;
    text-align: center;
    clear: both;
    position: fixed;
    bottom: 0px;
    width: 100%;
    background-image: -webkit-linear-gradient(270deg,rgba(0,0,0,0.00) 0%,rgba(0,0,0,1.00) 100%);
    background-image: -moz-linear-gradient(270deg,rgba(0,0,0,0.00) 0%,rgba(0,0,0,1.00) 100%);
    background-image: -o-linear-gradient(270deg,rgba(0,0,0,0.00) 0%,rgba(0,0,0,1.00) 100%);
    background-image: linear-gradient(180deg,rgba(0,0,0,0.00) 0%,rgba(0,0,0,1.00) 100%);
    padding-top: 10px;
    height: 30px;
}
  
   

.navlist   {
    list-style-type: none;
    background-color: #FFFFFF;
    overflow-x: hidden;
    overflow-y: visible;
}
.navlistitem {
    float: left;
    padding-top: 8px;
    padding-right: 8px;
    padding-bottom: 8px;
    padding-left: 8px;
}



nav {
	background-color: #F8F9FA;
	position: absolute;
	top: 0px; left: 0px;
	padding: 50px 0 0 0;
	width: 100%;
}

/* Nav */

nav::after {content:''; display: block; clear: both; }

nav ul { list-style: none; margin: 0; padding: 0px;}

nav ul li:hover { background-color:#F2F4F6; }
nav ul li:hover > ul { display: block; }

nav ul li a { 
	display: inline-block;
	color: #F8F9FA;
	padding: 10px 20px;
	text-decoration: none;
	width: 125px;
	position: relative;
}

nav ul li a:hover { background-color: #F2F4F6; }

nav ul ul { position: absolute; top: 80%; background-color: #F8F9FA; display: none; }

nav ul ul li { position: relative; }

nav ul ul ul { left: 100%; top: 0px; }


/* Nav:top-level */

nav > ul { padding-left: 200px; }
nav > ul > li { float: left; }
nav > ul > li > a { width: auto; padding: 10px 20px 15px 20px; }

nav a.dropdown::after {
	content:'';
	display: block; width: 0px; height: 0px;
	position: absolute;
	top: 16px; right: 13px;
	border-top: 4px solid #585858;
	border-bottom: 4px solid transparent;
	border-left: 4px solid transparent;
	border-right:  4px solid transparent;
} 

nav > ul > li > a[aria-haspopup="true"]::after {
	border-left: 4px solid transparent;
	border-right: 4px solid transparent;
	border-top: 4px solid #fff;
	left: 20px; right: auto;
	bottom: 6px; top: auto;
}

a.nav-link.dropdown, a.nav-link{ font-size: 20px}

.navbar.navbar-expand-lg.navbar-light.bg-light .navbar-brand {
    color: #4DB6EC;
}

.navbar-nav.mr-auto .nav-item .nav-link:hover {
    color: #4DB6EC;
}
 
/* Seasonal Anime Page */

Section.Seasonal {
	background-color:#767676;
    color: #3E3E3E;
	width: 49%;
	margin-right: 0%;
	margin-left: 1%;
	margin-top: 1%;
	margin-bottom: 1%;
	padding: 10px;
	float:left
}




ul.Seasonal{
	background-color:#D8EFFB;
	padding-bottom: 10px
}

ul.Seasonal h5,p{
	padding-top: 10px;
	padding-bottom: 10px
}

body section.Seasonal div h2{
	color:#151515;
	padding: 10px;
}
body section.Seasonal div ul.Seasonal p {margin-right: 10px}

body section.Seasonal div ul.Seasonal img.img-thumbnail.img-fluid {margin-left: -10px}



/* Genre Pages */

section.article {
	background-color: #767676;
    color: #3E3E3E;
    width: 90%;
    margin-left: 1%;
    margin-right: 2%;
    padding-top: 2%;
    padding-right: 2%;
    padding-bottom: 2%;
    padding-left: 2%;
	margin-top: 50px;
	float: right;
	white-space: normal;

}

aside.Anime {
	float: left;
	width:30%;
}

aside.Anime.Anime_1, 
aside.Anime.Anime_2,
aside.Anime.Anime_3{
background-color:#D8EFFB;
padding: inherit;
margin-right: 3%
}

aside.Anime.Anime_1 ul,
aside.Anime.Anime_2 ul,
aside.Anime.Anime_3 ul  {
padding-bottom: 5px
}

body aside h1.Article_Title {
	width: 100%;
	text-align: center
}

/* Homepage */

body {
    background-color:#C8C8C8;
    color: #fff;
    background-size: cover;
    background-attachment: fixed;
    font-family: sans-serif;
    font-weight: 300;
    font-size: small;
}

section.article_Home {
	background-color: #C8C8C8;
    color: #3E3E3E;
    width: 90%;
    margin-left: 1%;
    margin-right: 2%;
    padding-top: 2%;
    padding-right: 2%;
    padding-bottom: 2%;
    padding-left: 2%;
	margin-top: 50px;
	float: right;
	postion:flex;
	white-space: normal;}
	
aside.Top{
	float: left;
	width:30%;}


Aside.Top{background-color:#D8EFFB;
padding: inherit;
margin-right: 3%}

aside.Today{
	float: left;
	width:30%;}


Aside.Today{background-color:#D8EFFB;
padding: inherit;
margin-right: 3%}

aside.Top.Anime_5 {margin-top: -250px}
aside.Top.Anime_6 {margin-top:-500px}
aside.Top.Anime_7 {margin-top: 50px}



h1.News {
	margin-bottom: 20px;
	margin-top: 50px;
    font-size: 60px;
}

h1.Today_News {
	margin-top: 150px;
    font-size: 60px;
}

h1.Today_News,h1.News {
    float: left;
    border-bottom: thick dashed #3E3E3E;
	width:100%
}


/* Media Queries */

@media screen and (max-width: 1000px) {
	
/* Section- All */	
	
header img {width:125px; height: 75px;}
body aside h1.Article_Title{ font-size: 4.5em}


	 
/* Section- Home */
	h1.News {
    font-size: 50px;
}

h1.Today_News {
    font-size: 50px;
}
	
/* Section- Seasonal */
body section.Seasonal {width: 95%}
		
	

/* Section- Article */
	
ul.Seasonal_List {
    position: relative
}
	
ul.Genre_List {
	position: relative
}

}
@media screen and (max-width: 825px) {
	
/* Section- All */	
	
header img {width:100px; height: 75px;}
body aside h1.Article_Title{ font-size: 4em}
	
/* Section- Home */
	h1.News {
    font-size: 40px;
}

h1.Today_News {
    font-size: 40px;
	
	
}
	
	body section.article_Home aside.Top.Anime_6 {
    margin-top:-400px
	}
		body section.article_Home aside.Top.Anime_5 {
    margin-top:-150px
	}
	
	
	body section.article_Home aside.Top.Anime_1 p,
	body section.article_Home aside.Top.Anime_2 p,
	body section.article_Home aside.Top.Anime_3 p,
	body section.article_Home aside.Top.Anime_4 p,
	body section.article_Home aside.Top.Anime_5 p,
	body section.article_Home aside.Top.Anime_6 p,
	body section.article_Home aside.Top.Anime_7 p,
	body section.article_Home aside.Today.Anime_1 p,
	body section.article_Home aside.Today.Anime_2 p,
	body section.article_Home aside.Today.Anime_3 p{
		
		font-size:12px
	}
	
	body section.article_Home aside.Top.Anime_1 h2,
	body section.article_Home aside.Top.Anime_2 h2,
	body section.article_Home aside.Top.Anime_3 h2,
	body section.article_Home aside.Top.Anime_4 h2,
	body section.article_Home aside.Top.Anime_5 h2,
	body section.article_Home aside.Top.Anime_6 h2,
	body section.article_Home aside.Top.Anime_7 h2,
	body section.article_Home aside.Today.Anime_1 h2,
	body section.article_Home aside.Today.Anime_2 h2,
	body section.article_Home aside.Today.Anime_3 h2 {
		font-size:20px
	}

	
/* Section- Seasonal */
body section.Seasonal div ul.Seasonal p {font-size:1em }
	

/* Section- Article */
	



}
@media screen and (max-width: 760px) {
	
	
/* Section- All */	
	
header img {width:100px; height: 75px;}

body aside h1.Article_Title {font-size:3em}
	
/* Section- Home */
section.article_Home aside.Top.Anime_1,
	section.article_Home aside.Top.Anime_2, 
	section.article_Home aside.Top.Anime_3,
	section.article_Home aside.Top.Anime_4,
	section.article_Home aside.Top.Anime_5,
	section.article_Home aside.Top.Anime_6,
	section.article_Home aside.Top.Anime_7,
	section.article_Home aside.Today.Anime_1,
	section.article_Home aside.Today.Anime_2,
	section.article_Home aside.Today.Anime_3
 {
	
width: 100%;
margin-top: 20px;
	}
	
	body section.article_Home aside.Top.Anime_5 {
    margin-top:20px
	}
	
	body section.article_Home aside.Top.Anime_6 {
    margin-top:20px
	}
	
	
	
img.img-thumbnail.img-fluid.Home {display: block}
	
/* Section- Seasonal */
body section.Seasonal div ul.Seasonal p {
	font-size:0.8em 
	}
	
	body section.Seasonal div h2{
	font-size:1.5em;	
	}
	
	body section.Seasonal div ul.Seasonal h5{
	font-size:1.3em;	
	}


/* Section- Article */
body section.article aside.Anime.Anime_1 ul a.btn_show,
body section.article aside.Anime.Anime_2 ul a.btn_show,
body section.article aside.Anime.Anime_3 ul a.btn_show{
		font-size: .8em
	}
	
body section.article aside.Anime.Anime_1 h2,	
body section.article aside.Anime.Anime_2 h2,
body section.article aside.Anime.Anime_3 h2 {
	font-size:1.5em
	}
	

}
@media screen and (max-width: 625px) {
	
/* Section- All */	
	
header img {width:75px; height: 50px;}
	
body aside h1.Article_Title {font-size:2.5em}

	
/* Section- Home */


	
/* Section- Seasonal */
body section.Seasonal div ul.Seasonal p {font-size:.7em }	


	

/* Section- Article */
	
section.article aside.Anime.Anime_1, section.article aside.Anime.Anime_2, section.article aside.Anime.Anime_3 {
width: 100%;
margin-top: 5px;
	}
	


	

	

}
@media screen and (max-width:425px){
	
	/* Section- All */	
	
header img {
	width:50px; height:50px;
	margin-top: -30px;
	}
	
body aside h1.Article_Title {
	font-size:35px;
	margin-top: -60px;
	}
	


	
/* Section- Home */
	
	body h1.News, body h1.Today_News {
		font-size:25px;
	}
	
	body section.article_Home aside.Top.Anime_1 p,
	body section.article_Home aside.Top.Anime_2 p,
	body section.article_Home aside.Top.Anime_3 p,
	body section.article_Home aside.Top.Anime_4 p,
	body section.article_Home aside.Top.Anime_5 p,
	body section.article_Home aside.Top.Anime_6 p,
	body section.article_Home aside.Top.Anime_7 p,
	body section.article_Home aside.Today.Anime_1 p,
	body section.article_Home aside.Today.Anime_2 p,
	body section.article_Home aside.Today.Anime_3 p{
		
		font-size:10px
	}
	  


		

	




	
/* Section- Seasonal */
body section.Seasonal div ul.Seasonal p {font-size:0.6em }


/* Section- Article */

section.article aside.Anime.Anime_1, section.article aside.Anime.Anime_2, section.article aside.Anime.Anime_3 {width: 100%; margin-top: 5px;}
	
body section.article aside.Anime.Anime_1 ul a.btn_show  {font-size: .5em}
	


	
	}


