diff --git a/frontend/css/color.txt b/frontend/css/color.txt
new file mode 100644
index 0000000..5f5bd2b
--- /dev/null
+++ b/frontend/css/color.txt
@@ -0,0 +1,10 @@
+grey:#555; (font color)
+red:#e74c3c,rgba(231, 76, 60,1.0),
+orange:#e67e22,rgba(230, 126, 34,1.0)
+
+Colors according to logo
+orange : ##fdad15 rgb(253, 173, 21)
+red : #b10e16, rgb(177, 14, 22)
+
+
+
diff --git a/frontend/css/img/binary.jpg b/frontend/css/img/binary.jpg
new file mode 100644
index 0000000..e890bf7
Binary files /dev/null and b/frontend/css/img/binary.jpg differ
diff --git a/frontend/css/img/robomaze.png b/frontend/css/img/robomaze.png
new file mode 100644
index 0000000..6896253
Binary files /dev/null and b/frontend/css/img/robomaze.png differ
diff --git a/frontend/css/img/rocket.jpg b/frontend/css/img/rocket.jpg
new file mode 100644
index 0000000..90df924
Binary files /dev/null and b/frontend/css/img/rocket.jpg differ
diff --git a/frontend/css/main.css b/frontend/css/main.css
index a0c2b66..d657772 100644
--- a/frontend/css/main.css
+++ b/frontend/css/main.css
@@ -92,3 +92,53 @@ body {
}
/* Events end */
+/************************************
+Base
+**************************************/
+
+*{
+ margin:0;
+ padding: 0;
+ -webkit-box-sizing: border-box;
+ box-sizing: border-box;
+}
+
+html,
+body{
+ background-color: #fff;
+ color:#555;
+ font-family: 'Muli', sans-serif;
+ font-size: 16px;
+ text-rendering: optimizeLegibility;
+ font-weight: 300;
+ overflow-x: hidden;
+}
+
+::selection{
+ background-color: #b10e16;
+ color: #fdad15;
+}
+
+/***************************************
+Headings
+****************************************/
+#content{
+ position: relative;
+}
+
+#content_head{
+ position: absolute;
+ left: 50%;
+ transform: translateX(-50%);
+ text-transform: uppercase;
+ font-size: 200px;
+ text-align: center;
+ font-weight: 600;
+ letter-spacing: 2px;
+ padding: 0px 120px;
+ display: inline-block;
+ margin: 60px auto;
+ color: #f4f4f4;
+ outline: 10px solid #f4f4f4;
+ outline-offset: 20px;
+}
diff --git a/frontend/css/news.css b/frontend/css/news.css
new file mode 100644
index 0000000..1378f84
--- /dev/null
+++ b/frontend/css/news.css
@@ -0,0 +1,367 @@
+*{
+ z-index: 10;
+}
+
+*::before{
+ z-index: 0;
+}
+html,body{
+ color:#f4f4f4;
+ font-size: 62.5%;/*1rem = 10px*/
+}
+
+
+#content_text div:nth-child(1){
+ display: none;
+}
+#content_text div:nth-child(2){
+ position: absolute;
+ margin: 1rem;
+ font-size: 1.6rem;
+}
+
+
+
+/* for congratulations*/
+.MsoNormal:nth-child(1){
+ position: absolute;
+ top: 60vh;
+ left: 50%;
+ transform: translateX(-50%);
+ text-transform: uppercase;
+ font-size: 13rem;
+ color: #e74c3c;
+ font-weight: 600;
+ animation: text-reveal 0.5s forwards;
+ letter-spacing: 3px;
+ z-index: 50;
+ text-shadow:1px 1px 1px #b10e16 ;
+}
+
+.MsoNormal:nth-child(1)::after{
+ content: "";
+ height: 5px;
+ background-color: #e74c3c;
+ width: 20rem;
+ margin: 0 auto;
+ position: absolute;
+ top: 120%;
+ left: 50%;
+ animation: enlarge 0.5s forwards;
+
+}
+/* end*/
+
+/**********************
+Common styles in congratulation
+**********************/
+
+/*for Text*/
+
+.MsoNormal:nth-child(3),
+.MsoNormal:nth-child(6),
+.MsoNormal:nth-child(8),
+.MsoNormal:nth-child(9),
+.MsoNormal:nth-child(11),
+.MsoNormal:nth-child(13),
+.MsoNormal:nth-child(14){
+ position: absolute;
+ text-align: center;
+}
+
+/*Name*/
+.MsoNormal:nth-child(3),
+.MsoNormal:nth-child(8),
+.MsoNormal:nth-child(11){
+ font-size:3rem;
+ display: inline-block;
+ width: 50rem;
+ letter-spacing: 3px;
+ line-height: 4.05rem;
+}
+
+/*Winner text*/
+
+.MsoNormal:nth-child(6),
+.MsoNormal:nth-child(9),
+.MsoNormal:nth-child(13),
+.MsoNormal:nth-child(14){
+ text-transform: uppercase;
+ letter-spacing: 3px;
+}
+
+
+.MsoNormal:nth-child(6) span:first-of-type,
+.MsoNormal:nth-child(9) span:first-of-type,
+.MsoNormal:nth-child(13){
+ display: block;
+ font-size: 9rem;
+}
+.MsoNormal:nth-child(6) span:not(:first-of-type),
+.MsoNormal:nth-child(9) span:not(:first-of-type),
+.MsoNormal:nth-child(14){
+ font-size: 2.5rem;
+ letter-spacing: 30px;
+}
+
+
+/* Background */
+.MsoNormal:nth-child(10),
+.MsoNormal:nth-child(12){
+ height: 110vh;
+}
+.MsoNormal:nth-child(10)::before,
+.MsoNormal:nth-child(12)::before{
+ content: "";
+ background-repeat: no-repeat;
+ background-attachment: fixed;
+ position: absolute;
+ width: 100vw;
+ height: 110vh;
+ background-size: cover;
+}
+
+.MsoNormal:nth-child(7),
+.MsoNormal:nth-child(15){
+ position: absolute;
+ width: 50%;
+ z-index: 1;
+ height: 110vh;
+}
+
+
+/**********************
+1st congratulation
+**********************/
+
+/*for Text*/
+
+.MsoNormal:nth-child(3),
+.MsoNormal:nth-child(6){
+ right: 25%;
+ transform: translateX(50%);
+}
+
+/*Name*/
+.MsoNormal:nth-child(3){
+ top:170vh;
+}
+
+/*Winner text*/
+
+.MsoNormal:nth-child(6){
+ top: 130vh;
+}
+
+/* Background */
+.MsoNormal:nth-child(2){
+ height: 220vh;
+}
+.MsoNormal:nth-child(2)::before{
+ content: "";
+ background-image: url('img/robomaze.png');
+ background-repeat: no-repeat;
+ background-attachment: fixed;
+ position: absolute;
+ top: 0;
+ left: 0;
+ width: 100vw;
+ height: 220vh;
+ background-size: cover;
+}
+
+.MsoNormal:nth-child(4),
+.MsoNormal:nth-child(5){
+ position: absolute;
+ width: 50%;
+ z-index: 1;
+ height: 110vh;
+}
+.MsoNormal:nth-child(4){
+ top: 0;
+ left: 0;
+ background-color: #b10e16;
+}
+.MsoNormal:nth-child(5){
+ top: 110vh;
+ right: 0;
+ background-color: #e67e22;
+}
+
+/**********************
+2nd congratulation
+**********************/
+
+.MsoNormal:nth-child(8),
+.MsoNormal:nth-child(9){
+ left: 25%;
+ transform: translateX(-50%);
+}
+
+/*Name*/
+.MsoNormal:nth-child(8){
+ top:280vh;
+}
+
+/*Winner text*/
+
+.MsoNormal:nth-child(9){
+ top: 240vh;
+}
+
+
+/* Background */
+.MsoNormal:nth-child(10)::before{
+ background-image: url('img/binary.jpg');
+ top: 220vh;
+ left: 0%;
+}
+
+.MsoNormal:nth-child(7){
+ background-color:#2c3e50;
+ top: 220vh;
+ left: 0;
+}
+
+/**********************
+3rd congratulation
+**********************/
+
+.MsoNormal:nth-child(11),
+.MsoNormal:nth-child(13),
+.MsoNormal:nth-child(14){
+ right: 25%;
+ transform: translateX(50%);
+}
+
+/*Name*/
+.MsoNormal:nth-child(11){
+ top:390vh;
+}
+
+/*Winner text*/
+
+.MsoNormal:nth-child(13){
+ top: 353vh;
+}
+.MsoNormal:nth-child(14){
+ top: 367vh;
+ letter-spacing: 15px !important;
+}
+
+
+/* Background */
+.MsoNormal:nth-child(12)::before{
+ background-image: url('img/rocket.jpg');
+ background-position: left;
+ background-size: 55%;
+ top: 330vh;
+ left: 0%;
+}
+
+.MsoNormal:nth-child(15){
+ background-color:#130f40;
+ top: 330vh;
+ right: 0;
+}
+
+/*********************************
+organized by......(section)
+*************************************/
+
+.MsoNormal:nth-child(16),
+.MsoNormal:nth-child(17),
+.MsoNormal:nth-child(20){
+ position: absolute;
+ left: 50%;
+ transform: translateX(-50%);
+}
+
+.MsoNormal:nth-child(18){
+ content: "";
+ position: absolute;
+ left: 50%;
+ transform: translateX(-50%);
+ top: 430vh;
+ background-color: #e67e22;
+ width: 114rem;
+ height: 60vh;
+ box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22);
+ z-index: 8;
+}
+
+
+.MsoNormal:nth-child(19){
+ height: 60vh;
+ width: 100%;
+}
+.MsoNormal:nth-child(19)::before{
+ content: "";
+ position: absolute;
+ width: 100%;
+ height: 60vh;
+ background-color: #b10e16;
+ left: 0;
+
+}
+.MsoNormal:nth-child(16){
+ font-size: 5rem;
+ letter-spacing: 7px;
+ top: 435vh;
+}
+.MsoNormal:nth-child(17){
+ top: 449vh;
+ font-size: 1.6rem;
+}
+
+.MsoNormal:nth-child(20){
+ top: 456vh;
+ font-size: 2.5rem;
+}
+.MsoNormal:nth-child(23),
+.MsoNormal:nth-child(24){
+ position: absolute;
+ top: 476vh;
+ left: 25.6%;
+ left: 25.6%;
+
+}
+.MsoNormal:nth-child(23){
+ top: 476vh;
+ font-size: 1.6rem;
+}
+.MsoNormal:nth-child(24){
+ font-size: 1.6rem;
+ top: 480vh;
+}
+.MsoNormal:nth-child(21){
+ display: none;
+}
+.MsoNormal:nth-child(22){
+ display: none;
+}
+
+
+/*********************
+animations
+**********************/
+
+
+@keyframes text-reveal{
+ 0%{
+ letter-spacing: -8.4rem;
+ }
+ 100%{
+ letter-spacing: 3px;
+ }
+}
+
+
+@keyframes enlarge{
+ 0%{
+ transform:translate(-50%) scaleX(0);
+ }
+ 100%{
+ transform:translateX(-50%) scaleX(1);
+ }
+}
\ No newline at end of file
diff --git a/frontend/css/notice.css b/frontend/css/notice.css
new file mode 100644
index 0000000..e69de29
diff --git a/frontend/css/queries_news.css b/frontend/css/queries_news.css
new file mode 100644
index 0000000..0750e5a
--- /dev/null
+++ b/frontend/css/queries_news.css
@@ -0,0 +1,223 @@
+/*addditionls*/
+
+@media only screen and (max-width: 1478px){
+ /* for organized by section*/
+ .MsoNormal:nth-child(17){
+ top: 452vh;
+ }
+ .MsoNormal:nth-child(20){
+ top: 459vh;
+ }
+ /*end*/
+}
+
+@media only screen and (max-width: 1354px){
+ .MsoNormal:nth-child(1){
+ font-size: 10rem;
+ }
+ .MsoNormal:nth-child(14){
+ letter-spacing: 8px !important;
+ }
+}
+
+
+@media only screen and (max-width: 1302px){
+ html,body{
+ font-size: 50%; /*1rem = 8px*/
+ }
+
+ /*for title*/
+ #content_head{
+ font-size: 150px;
+ }
+ /*end*/
+
+
+
+}
+@media only screen and (max-width: 968px){
+ html,body{
+ font-size: 48%;
+ }
+ /* for organized by section*/
+ .MsoNormal:nth-child(17){
+ top: 460vh;
+ }
+ .MsoNormal:nth-child(20){
+ top: 467vh;
+ }
+ .MsoNormal:nth-child(23){
+ top: 477vh;
+ }
+ .MsoNormal:nth-child(24){
+ top: 481vh;
+ }
+ /*end*/
+}
+
+@media only screen and (max-width: 841px){
+ html,body{
+ font-size: 40%;
+ }
+ #content_head{
+ font-size: 110px;
+ padding: 0px 80px;
+
+ }
+ #content_text div:nth-child(2){
+ font-size: 2rem;
+ }
+ .MsoNormal:nth-child(23){
+ font-size: 2.1rem;
+ }
+ .MsoNormal:nth-child(24){
+ font-size: 2.1rem;
+ }
+ .MsoNormal:nth-child(17){
+ font-size: 2.1rem;
+ }
+
+ .MsoNormal:nth-child(20){
+ font-size: 2.7rem;
+ }
+}
+
+@media only screen and (max-width: 792px){
+ html,body{
+ font-size: 35%;
+ }
+ #content_text div:nth-child(2){
+ background-color: rgba(0,0,0,.5);
+ }
+
+
+ .MsoNormal:nth-child(1){
+ top: 70vh;
+ }
+ /* change layout*/
+ .MsoNormal:nth-child(4),
+ .MsoNormal:nth-child(5){
+ width: 100%;
+ height: 55vh;
+ }
+ .MsoNormal:nth-child(4){
+ top: 55vh;
+ left: 0;
+ }
+ .MsoNormal:nth-child(5){
+ top: 165vh;
+ right: 0;
+ }
+ .MsoNormal:nth-child(7),
+ .MsoNormal:nth-child(15){
+ width: 100%;
+ height: 55vh;
+ }
+
+ /*layout end*/
+
+ /*POSTIONING*/
+ /**********************
+ 1st congratulation
+ **********************/
+ .MsoNormal:nth-child(3),
+ .MsoNormal:nth-child(6){
+ right: 50%;
+ transform: translateX(50%);
+ }
+ /*Name*/
+ .MsoNormal:nth-child(3){
+ top:200vh;
+ }
+
+ /*Winner text*/
+
+ .MsoNormal:nth-child(6){
+ top: 170vh;
+ }
+
+
+ /**********************
+ 2nd congratulation
+ **********************/
+
+ .MsoNormal:nth-child(8),
+ .MsoNormal:nth-child(9){
+ left: 50%;
+ }
+
+ /*Name*/
+ .MsoNormal:nth-child(8){
+ top:310vh;
+ }
+
+ /*Winner text*/
+
+ .MsoNormal:nth-child(9){
+ top: 280vh;
+ }
+
+
+ /* Background */
+
+ .MsoNormal:nth-child(7){
+ top: 275vh;
+ }
+ /**********************
+ 3rd congratulation
+ **********************/
+
+ .MsoNormal:nth-child(11),
+ .MsoNormal:nth-child(13),
+ .MsoNormal:nth-child(14){
+ right: 50%;
+ }
+
+ /*Name*/
+ .MsoNormal:nth-child(11){
+ top:410vh;
+ }
+
+ /*Winner text*/
+
+ .MsoNormal:nth-child(13){
+ top: 390vh;
+ }
+ .MsoNormal:nth-child(14){
+ top: 400vh;
+ }
+
+
+ /* Background */
+ .MsoNormal:nth-child(12)::before{
+ background-position: auto;
+ background-size:cover;
+ }
+
+ .MsoNormal:nth-child(15){
+ top: 385vh;
+ }
+
+ /*POSITIONING END*/
+
+}
+
+@media only screen and (max-width: 627px){
+ #content_head{
+ font-size: 70px;
+ padding: 0px 50px;
+ }
+ .MsoNormal:nth-child(1){
+ font-size: 6rem;
+ }
+}
+@media only screen and (max-width: 400px){
+ #content_head{
+ font-size: 45px;
+ padding: 0px 20px;
+ }
+ .MsoNormal:nth-child(1){
+ font-size: 3.8rem;
+ }
+
+}
\ No newline at end of file
diff --git a/frontend/news_notice/news_raw.html b/frontend/news_notice/news_raw.html
index ebccb98..e2ee4d0 100644
--- a/frontend/news_notice/news_raw.html
+++ b/frontend/news_notice/news_raw.html
@@ -1,186 +1,184 @@
-
-
-
-
-
-
-
-
- news
-
-
-
-
-
-
- Congratulations! Trinitians
-
-
- Thursday, 29 Aug 2019
-
-
-
-
-
- Congratulations!
-
-
-
-
-
-
-
-
-
-
-
-
- Siddhartha Gautam, Anupam Koirala, Sajen Maharjan, Aavash Basnet & Ujjwal Shrestha
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- Winner -
-
-
- RoboMaze
-
-
-
-
-
-
-
-
-
-
-
-
- Aabishkar Thapa Kshetri, Manash Adhikari, Ankit Shrestha & Bibek Shah
-
-
-
-
-
-
-
- Second -
-
-
- Hackathon
-
-
-
-
-
-
-
-
-
-
-
-
- Anupam Koirala, Aman Paudel & Aayushma Upreti
-
-
-
-
-
-
-
-
-
-
-
-
- First
-
-
-
-
-
-
- Science & Techno Quiz
-
-
-
-
-
-
-
-
-
-
-
- BNKS TECHNOFEST 2019
-
-
-
-
-
-
- (August 23-25)
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- Organized by Budhnilkantha School.
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- ECA DEPARTMENT
-
-
-
-
-
- Monday, August 26, 2019
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ news
+
+
+
+
+
+
+ Congratulations! Trinitians
+
+
+ Thursday, 29 Aug 2019
+
+
+
+
+
+ Congratulations!
+
+
+
+
+
+
+
+
+
+
+
+ Siddhartha Gautam, Anupam Koirala, Sajen Maharjan, Aavash Basnet & Ujjwal Shrestha
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Winner -
+
+
+ RoboMaze
+
+
+
+
+
+
+
+
+
+
+ Aabishkar Thapa Kshetri, Manash Adhikari, Ankit Shrestha & Bibek Shah
+
+
+
+
+
+ Second -
+
+
+ Hackathon
+
+
+
+
+
+
+
+
+
+
+ Anupam Koirala, Aman Paudel & Aayushma Upreti
+
+
+
+
+
+
+
+
+
+
+
+ First
+
+
+
+
+
+
+ Science & Techno Quiz
+
+
+
+
+
+
+
+
+
+
+
+ BNKS TECHNOFEST 2019
+
+
+
+
+
+
+ (August 23-25)
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Organized by Budhnilkantha School.
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ ECA DEPARTMENT
+
+
+
+
+
+ Monday, August 26, 2019
+
+
+
+
+
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+