diff --git a/index.html b/index.html index 3fa14bf..81540cd 100644 --- a/index.html +++ b/index.html @@ -81,60 +81,73 @@

CHAIBASA ENGINEERING
COLLEGE

BRANCHES IN CEC

+
+
computer science engineering image CSE -
-
Computer Science Engineering (CSE) is an +
+
+

Computer Science Engineering (CSE) is an engineering discipline that covers several topics related to computation, programming languages, program design, computer hardware and software - and integrates several fields of computer science. + and integrates several fields of computer science.

+ CSE
-

+
+
+
Electronics and Communication Engineering image ECE -
-
Electronics and Communication Engineering (ECE) is an emerging stream that +
+

Electronics and Communication Engineering (ECE) is an emerging stream that offers firm promises to lend your career an edge. Studying this domain of engineering would mean mastering the skills related to electrical engineering as well - as having an insight into the world of computer software and hardware. + as having an insight into the world of computer software and hardware.

+ ECE
-

+
+
electrical and electronics engineering image EEE -
-
Electrical and Electronics Engineering. EEE is an engineering discipline which deals with Electrical and Machine technology, Electrons, Circuit analysis, +
+

Electrical and Electronics Engineering. EEE is an engineering discipline which deals with Electrical and Machine technology, Electrons, Circuit analysis, Electromagnetism, Instrumentations, Materials for electrical engineering, - Control systems, transmission and distribution, Power engineering.

-
-

+ Control systems, transmission and distribution, Power engineering. + EEE
+
+
+
mechanical engineering image ME -
-
Mechanical engineering is an engineering branch +
+

Mechanical engineering is an engineering branch that combines engineering physics and mathematics principles with materials science, to design, analyze, - manufacture, and maintain mechanical systems.

-
-

+ manufacture, and maintain mechanical systems. + ME +
+
+
+
civi engineering image CE -
-
Civil engineering is a professional engineering discipline that deals with the design, +
+

Civil engineering is a professional engineering discipline that deals with the design, construction, and maintenance of the physical and naturally built environment, - including public works such as roads, bridges, canals, dams, airports, and railways.

-
-

+ including public works such as roads, bridges, canals, dams, airports, and railways. + CE
+
diff --git a/style.css b/style.css index c8c2bed..8d5f5cf 100644 --- a/style.css +++ b/style.css @@ -229,15 +229,60 @@ p { } .col-3 { + background-color: transparent; + align-items: center; + display: flex; + flex-direction: row; + width: 300px; + height: auto; + perspective: 1000px; + margin-bottom: 100px; + +} + +.inner{ position: relative; + width: 100%; + height: 100%; text-align: center; - flex-basis: 30%; - min-width: width 250px; - margin-bottom: 30px; - margin-left: auto; - margin-right: auto; + transition: transform 0.8s; + transform-style: preserve-3d; +} + + +.col-3:hover .inner{ + transform: rotateY(180deg); +} + +.front-side, .dis{ + position: absolute; + width: 100%; + height: 100%; + -webkit-backface-visibility: hidden; /* Safari */ + backface-visibility: hidden; +} + +.front-side{ + background-color: #bbb; + /* color: black; */ + border-radius: 20px; + height: 200px; +} + +.dis{ + background-color: rgb(255, 166, 166); + color: black; + + transform: rotateY(180deg); + } +.dis h3{ + font-size: 20px; + text-align:center; +} + + .col-3 img { width: 100%; } @@ -522,21 +567,23 @@ form input { } .dis { - position: absolute; - bottom: 20%; + height: 200px; + border-radius: 10px; + align-items: center; + height: 100%; + justify-content: center; + position: relative; text-align: center; font-size: 13px; padding: 1rem 1rem; transition: .5s ease; - background-color: #a6b6bb; - opacity: 0; - overflow: hidden; - ; + /* background-color: black */ + } -.col-3:hover .dis { +/* .col-3:hover .dis { opacity: 1; -} +} */ #pic { display: flex; diff --git a/syllabus.css b/syllabus.css index 83ed967..ee7c99e 100644 --- a/syllabus.css +++ b/syllabus.css @@ -133,7 +133,7 @@ h1 { .search__icon { box-sizing: border-box; - float: right; + /* float: right; */ font-size: 1.25rem; display: inline-block; margin-left: .8rem;