mohitkr827/ABC-University

1*{2   margin: 0;3   padding: 0; 4   font-family: 'Raleway', sans-serif;5}6.header{7    min-height: 100vh;8    width: 100%;9    background-image: linear-gradient(rgba(4,9,30,0.7),rgba(4,9,30,0.7)),url(images/bg.jpg);10    background-position: center;11    background-size: cover;12    position: relative;13 14}15nav{16    display: flex;17    padding: 2% 6%;18    justify-content: space-between ;19    align-items: center;20}21nav img{22    width: 400px;23}24.nav-links{25    flex: 1;26    text-align: right;27}28.nav-links ul li{29    list-style: none;30    display: inline-block;31    padding: 8px 12px;32    position: relative;33 34}35.nav-links ul li a{36    color: white;37    text-decoration: none;38    font-size: 15px;39}40.nav-links ul li::after{41    content: '';42    width: 0%;43    height: 2px;44    background: orange;45    display: block;46    margin: auto;47    transition: 0.5s;48}49.nav-links ul li:hover::after{50    width: 100%;51}52.text-box{53    width: 90%;54    color: white;55    position: absolute;56    top: 50%;57    left: 50%;58    transform: translate(-50%,-50%);59    text-align: center;60}61.text-box h1{62    font-size: 62px;63}64.text-box p{65    margin: 10px 0 40px;66    font-size: 14px;67    color: white;68}69.more-btn{70    display: inline-block;71    text-decoration: none;72    color: white;73    border: 1px solid white;74    padding: 12px 34px;75    background: transparent;76    position: relative;77    cursor: pointer;78}79.more-btn:hover{80    border: 1px solid orange;81    background: orange;82    transition: 1s;83}84nav .lni{85    display: none;86}87 88@media(max-width: 700px){89    .text-box h1{90        font-size: 20px;91    }92    .nav-links ul li{93        display: block;94    }95    .nav-links{96        position: absolute;97        background: orange;98        height: 100vh;99        width: 200px;100        top: 0;101        right: -200px;102        text-align: left;103        z-index: 2;104        transition: 1s;105    }106    nav .lni{107        display: block;108        color: white;109        margin: 10px;110        font-size: 22px;111        cursor: pointer;112 113    }114    .nav-links ul{115        padding: 30px;116 117    }118}119 120/*-----courses-----*/121 122.course{123    width: 80%;124    margin: auto;125    text-align: center ;126    padding-top: 100px;127}128h1{129    font-size: 36px;130    font-weight: 600;131}132p{133    color: black;134    font-size: 14px;135    font-weight: 300;136    line-height: 22px;137    padding: 10px;138}139 140.row{141    margin-top: 5%;142    display: flex;143    justify-content: space-between;144}145.course-col{146    flex-basis: 31%;147    background: rgb(236, 194, 145);148    border-radius: 10px;149    margin-bottom: 5%;150    padding: 20px 12px;151    box-sizing: border-box;152    transition: 0.5s;153 154}155h3{156    text-align: center;157    font-weight: 600;158    margin: 10px 0;159}160.course-col:hover{161    box-shadow: 0 0 20px 0px rgba(0,0,0,0.5) ;162}163 164@media(max-width: 700px){165    .row{166        flex-direction: column;167    }168}169 170/*--campus--*/171 172.campus{173    width: 80%;174    margin: auto;175    text-align: center;176    padding-top: 50px;177}178 179.campus-col{180    flex-basis: 30%;181    border-radius: 10px;182    margin-bottom: 30px;183    position: relative;184    overflow: hidden;185}186.campus-col img{187    width: 100%;188    border-radius: 10px;189    display: block;190}191.layer{192    background: transparent;193    height: 100%;194    width: 100%;195    position: absolute;196    top: 0;197    left: 0;198    transition: 0.5s;199 200}201.layer:hover{202    background: rgba(255, 137, 69, 0.7);203}204.layer h3{205    width: 100%;206    font-weight: 500;207    color: white;208    font-size: 26px;209    bottom: 0;210    left: 50%;211    transform: translate(-50%);212    position: absolute;213    opacity: 0;214    transition: 0.5s;215}216.layer:hover h3{217    bottom: 49%;218    opacity: 1;219}220 221/*----facilities---*/222 223.fac{224    width: 80%;225    margin: auto;226    text-align: center;227    padding-top: 100px ;228 229}230.fac-col{231    flex-basis: 31%;232    border-radius: 10px;233    margin-bottom: 5%;234    text-align: left;235 236}237.fac-col img{238    width: 100%;239    border-radius: 10px;240}241.fac-col p{242    padding: 0;243}244.fac-col h3{245    margin-top: 16px;246    margin-bottom: 15px;247    text-align: left;248}249/*---home contact--*/250.con{251    margin: 100px auto;252    width: 80%;253    background-image: linear-gradient(rgba(0,0,0,0.3),rgba(0,0,0,0.7)),url(images/conh.jpg);254    background-position: center;255    background-size: cover;256    border: 10px;257    text-align: center;258    padding: 10px;259}260.con h1{261    color: white;262    margin-bottom: 40px;263    padding: 0;264}265 266/*----footer---*/267 268.footer{269    width: 100%;270    text-align: center;271    padding: 30px 0;272}273.footer h4{274    margin-bottom: 25px;275    margin-top: 20px;276    font-weight: 600;277}278.icons .lni{279    color: rgb(255, 87, 9);280    margin: 0 13px;281    cursor: pointer;282    padding: 18px 0;283}284 285 286/*----------ABOUT PAGE-----------*/287 288.sub-header{289    height: 50vh;290    width: 100%;291    background-image: linear-gradient(rgba(4,9,30,0.7),rgba(4,9,30,0.7)),url(images/abbg.jpg);292    background-position: center;293    background-size: cover;294    text-align: center;295    color: white;296}297.sub-header h1{298    margin-top: 100px;299 300}301.abt{302    width: 80%;303    margin: auto;304    padding-top: 80px;305    padding-bottom: 50px;306}307.abt-col{308    flex-basis: 48%;309    padding: 30px 2px;310}311.abt-col img{312    width: 100%;313}314.abt-col h1{315    padding-top: 0;    316}317.abt-col p{318    padding: 15px 0 25px;319}320.no-btn{321    border: 1px solid orange;322    background: transparent;323    color: orange;324}325.no-btn:hover{326    color: white;327}328 329/*---------FEEDBACK PAGE-----*/330 331.feed{332    width: 80%;333    margin: auto;334    padding: 60px 0;335 336}337.feed-left{338    flex-basis: 65%;339 340}341.feed-left img{342    width: 100%;343}344.feed-left h2{345    color: black;346    font-weight: 600;347    margin: 30px 0;348}349.comment{350    border: 1px solid #cccc;351    margin: 0.05px 0;352    padding: 0.001px 20px;353}354.comment h3{355    text-align: left;356}357.comment-form input,textarea{358    width: 100%;359    padding: 10px;360    margin: 15px 0;361    box-sizing: border-box;362    border: none;363    outline: none;364    background: #f0f0f0;365}366.comment-form button{367    margin: 10px 0;368}369 370/*------contact us page -----------------*/371 372.location{373    width: 80%;374    margin: auto;375    padding: 80px 0;376}377.location iframe{378    width: 100%; 379}380 381.contus{382    width: 80%;383    margin: auto;384}385.contus-col{386    flex-basis: 48%;387    margin-bottom: 30px;388}389.contus-col div{390    display: flex;391    align-items: center;392    margin-bottom: 40px;393}394.contus-col div .lni{395    font-size: 28px;396    color: red;397    margin: 10px;398    margin-right: 30px;399}400.contus-col div p{401    padding: 0;402}403.contus-col div h5{404    font-size: 20px;405    margin-bottom: 5px;406    color: #555;407    font-weight: 400;408}409.contus-col input, .contus-col textarea{410    width: 100%;411    padding: 15px;412    margin-bottom: 17px;413    outline: none;414    border: 1px solid #ccc ;415}