@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@100;200;300;400;500;600;700;800;900&display=swap');



* {margin: 0; padding: 0; box-sizing: border-box;}

body {font-family: 'Montserrat', sans-serif; font-size: 16px;}



.container {width: 86%; margin: 0 auto;}

.container::after {content: ''; display: block; clear: both;}

.clear {display: block; clear: both;}



header {/*position: fixed; top: 0; left: 0;*/ width: 100%; padding: 12px 0; z-index: 1;}

header.fixed {background: rgba(0,0,0,.7);}

header .logo {display: inline-block; vertical-align: middle; width: 280px;}

header .contact {display: inline-block; vertical-align: middle; width: calc(100% - 280px - 8px); text-align: right; color: #494949;}

header .contact strong {color: #e50c15;}

header .contact a {color: inherit; text-decoration: none;}

header .contact .box {display: inline-block; vertical-align: middle; margin-left: 20px;}

header .contact .box:nth-child(1) {margin-left: 0;}



footer {padding: 40px 0 80px; background: #2e2e2e; color: #fff;}

footer .pic {display: inline-block; width: 200px; vertical-align: middle; padding: 4px; border-radius: 4px; background: #fff;}

footer .pic img {width: 100%;}

footer .address {display: inline-block; width: calc(100% - 200px - 8px - 32px); margin-left: 32px; vertical-align: middle;}

footer h4 {font-size: 24px; margin-bottom: 28px;}

footer p {font-size: 14px; margin-bottom: 20px;}

footer a {color: inherit;}



.banSlider {z-index: 1; position: relative;}

.banSlider ul li img {width: 100%; float: left;}

.banSlider ul li::before {content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; /*background: rgba(0,0,0,.4);*/ background-image: linear-gradient(to right, rgba(0, 0, 0, .8), rgba(0, 0, 0, .3), rgba(0, 0, 0, 0), rgba(0, 0, 0, .5)); z-index: 0;}

.banSlider ul li::after {content: ''; display: block; clear: both;}



.banSlider ul li .caption {position: absolute; transform: translateY(-50%); top: 50%; left: 0; /*padding: 32px; background: rgba(255,0,0,.8);*/ color: #fff; padding-left: 7%; z-index: 1; max-width: 86%;}

.banSlider ul li .caption h2 {font-size: 40px; font-weight: 900; margin-bottom: 12px; transition: all ease-in-out .2s; opacity: 0; transform: translateX(-50px);}

.banSlider ul li .caption h1 {font-size: 48px; font-weight: 900; background: red; display: inline-block; padding: 0 12px; transition: all ease-in-out .2s; opacity: 0; transform: translateX(50px);}



.banSlider ul li[aria-hidden=false] .caption h2 {opacity: 1; transform: translateX(0);}

.banSlider ul li[aria-hidden=false] .caption h1 {opacity: 1; transform: translateX(0);}



.banner {position: relative;}

.form {display: block; width: calc(300px); position: absolute; top: 50%; right: 0; transform: translateY(-50%); z-index: 2;}

.form .container {width: 100%; padding: 32px 32px 32px calc(46px + 32px); background: #fff;}

.form h2 {font-size: 22px; text-align: center; margin-bottom: 22px; position: absolute; top: 0; left: 0; background: #fd2727; color: #fff; height: 100%; text-transform: uppercase; padding: 12px; font-weight: 300; border-left: 1px solid #fff;}
.form p {font-size: 20px; text-align: center; margin-bottom: 22px;  top: 0; left: 0; background: #fff; color: #000;   padding: 1px; font-weight: 300; border-left: 1px solid #fff;width:100%;}

.form .field {display: block; margin-bottom: 12px;}

.form .field input[type=text], .form .field select, .form .field input[type=email] {display: block; width: 100%; height: 32px; border: 0; border-bottom: 1px solid #ccc; outline: 0;}

.form .submit {display: block; padding-top: 12px;}

.form .submit input[type=submit] {display: block; width: 100%; height: 32px; border: 0; background: #000; color: #fff; text-align: center; cursor: pointer;}



.welcome {padding: 80px 0;}

.welcome .txt {display: inline-block; width: calc(45% - 4px); vertical-align: middle; text-align: justify;}

.welcome .txt h2 {font-size: 42px; margin-bottom: 40px; font-weight: 500; text-align: left;}

.welcome .txt h2 strong {color: #e50c15;}

.welcome .txt p {margin-bottom: 20px;}

.welcome .txt p:last-child {margin-bottom: 0;}

.welcome .pic {display: inline-block; width: calc(45% - 4px); vertical-align: middle; margin-left: 10%;}

.welcome .pic img {width: 100%;}



.courses {padding: 80px 0; background: #f1f1f1;}

.courses h2 {font-size: 48px; text-align: center; font-weight: 300; margin-bottom: 48px;}

.courses p {text-align: center; font-weight: 300; margin-bottom: 48px;}

.courses .list {display: block;}

.courses .list ul {display: flex; width: 100%; list-style: none;}

.courses .list ul li {width: 33.33%; text-align: center; border: 1px solid #ccc; border-radius: 12px; overflow: hidden; /*background: #fff;*/ transition: all ease-in-out .2s;}

.courses .list ul li img {width: 100%; }

.courses .list ul li:nth-child(2) {margin: 0 5%;}

.courses .list ul li .info {padding: 12px;}

.courses .list ul li h4 {font-size: 20px; color: #e50c15; font-weight: 300; margin-bottom: 4px;}

.courses .list ul li p {font-weight: 400; margin-bottom: 12px; color: #666666;}

.courses .list ul li:hover {transform: scale(1.1);}



.whyChoose {padding: 80px 0; background-image: linear-gradient(to bottom right, #000000, #160b46); color: #fff; /*animation-name: whyanim; animation-iteration-count: infinite; animation-delay: 0; animation-duration: 1s; transition: all ease-in-out .2s;*/}

@keyframes whyanim {

    0% {background-image: linear-gradient(to bottom right, #000000, #00539c);}

    50% {background-image: linear-gradient(to bottom right, #00539c, #000000);}

    100% {background-image: linear-gradient(to bottom right, #000000, #00539c);}

}

.whyChoose h2 {text-align: center; font-size: 42px; margin-bottom: 42px; font-weight: 300;}

.whyChoose .wrap {display: flex; width: 100%; margin-bottom: 32px;}

.whyChoose .box {display: inline-block; width: calc(33.33% - 4px - 4%); margin: 0 2%; background: #fff; color: #000; padding: 20px 12px; border-radius: 12px; text-align: center; vertical-align: middle; font-weight: 500;}

.whyChoose .last {text-align: center;}



.whyChoose .celebWrap .box {width: calc(33.33% - 4px - 4%); margin-bottom: 12px; background: none; text-align: center;}

.whyChoose .celebWrap .box img {width: 100%; max-width: 200px; border-radius: 50%; border: 8px solid #fff;}

.whyChoose .celebWrap .box .txt {/*text-align: left;*/ color: #fff; padding-top: 4px;}



.placement {padding: 80px 0; }

.placement h2 {text-align: center; font-size: 42px; margin-bottom: 42px; font-weight: 300;}

.placement .list {display: block;}

.placement .list .box {display: inline-block; width: calc(30% - 4px); margin-bottom: 32px; vertical-align: top; transition: all ease-in-out .2s;}

.placement .list .box:hover {transform: scale(1.1);}

.placement .list .box:nth-child(3n+2) {margin: 0 5%; margin-bottom: 32px;}

.placement .list .box .img {display: inline-block; width: calc(140px - 4px); vertical-align: middle;}

.placement .list .box .img img {max-width: 100%; width: 200px;}

.placement .list .box .txt {display: inline-block; width: calc(100% - 140px - 4px); padding-left: 12px; vertical-align: middle;}

.placement .list .box .txt span {display: block;}

.placement .list .box .txt .name {color: #e50c15; font-weight: 500;}

.placement .list .box .txt .desig {font-size: 14px;}



.bod {padding: 80px 0; background: #fff;}

.bod h2 {text-align: center; font-size: 32px; margin-bottom: 32px;}

.bodW {display: flex;}

.bod .box {display: inline-block; width: calc(25% - 4px - 4%); vertical-align: top; margin: 0 2%; /*background-image: linear-gradient(to bottom right, #000000, #013e5b); color: #fff;*/ padding: 32px 0; border-radius: 12px;}

.bod .box .pic {display: block; margin-bottom: 20px;}

.bod .box .pic img {width: 100%;}

.bod .box .txt {/*padding: 0 20px;*/ display: block;}

.bod .box .txt span {display: block;}

.bod .box .txt .desig {font-size: 14px;}



.mastersWork.whyChoose {background-image: linear-gradient(to bottom right, #000000, #901414);}



.stuReview {padding: 80px 0; background: #f8f8f8;}

.stuReview h2 {text-align: center; font-size: 42px; margin-bottom: 42px; font-weight: 600;}

.stuReview .user {display: inline-block; width: calc(200px - 4px); vertical-align: middle; text-align: center;}

.stuReview .user img {max-width: 236px; width: 100%; border-radius: 50%;}

.stuReview .wrap {display: block;}

.stuReview .box {text-align: left;}

.stuReview .speak {display: inline-block; vertical-align: middle; width: calc(100% - 200px - 4px - 32px); margin-left: 32px; font-size: 20px; font-style: italic;}

.stuReview .by {display: block;padding-top: 20px; font-size: 20px; font-weight: 700; color: #890808;}

.stuReview .bx-pager {text-align: center; padding-top: 32px;}

.stuReview .bx-pager .bx-pager-item{display: inline-block; margin: 0 4px;}

.stuReview .bx-pager .bx-pager-item .bx-pager-link {display: block; width: 12px; height: 12px; border: 1px solid red; background: #fff; border-radius: 50%; text-indent: 100px; overflow: hidden;}

.stuReview .bx-pager .bx-pager-item .bx-pager-link:hover, .stuReview .bx-pager .bx-pager-item .bx-pager-link.active {background: red;}



.industrySpeak {padding: 80px 0; /*background: #f8f8f8;*/background-image: linear-gradient(to bottom right, #f3f2f2, #d1d1d1);}

.industrySpeak h2 {text-align: center; font-size: 42px; margin-bottom: 42px; font-weight: 600;}

.indSpeak .indSpeak {display: block; width: 100%;}

.indSpeak .box {width: calc(48% - 4px); vertical-align: top; display: inline-block; margin-bottom: 32px; border-radius: 12px; overflow: hidden; border: 1px solid #ccc; transition: all ease-in-out .2s; cursor: pointer; background: #fff;}

.indSpeak .box:nth-child(2) {margin-left: 4%;}

.indSpeak .box .user {display: inline-block; width: calc(180px - 4px); vertical-align: middle;}

.indSpeak .box .user img {width: 100%;}

.indSpeak .box .txt {display: inline-block; width: calc(100% - 180px - 4px); padding: 0 20px; vertical-align: middle;}

.indSpeak .box .txt .speak {display: block; margin-bottom: 12px;}

.indSpeak .box .txt .by {display: block; font-weight: 600; font-style: italic;}

.indSpeak .box:hover {background-image: linear-gradient(to bottom right, #ffc107, #ff0707); color: #fff; transform: scale(1.1);}



.call_filmmaking {display: none; width: 100%; position: fixed; bottom: 0; left: 0; background: #FB3939; z-index: 10000;}

.call_filmmaking > div {display: table-cell; width: 50%; text-align: center;}

.call_filmmaking > div:nth-child(2) {border-left: 1px solid #fff;}

.call_filmmaking > div a {display: block; padding: 8px 8px; color: #fff; font-weight: 700; text-decoration: none; font-size: 12px;}

.call_filmmaking > div a img {display: inline-block; vertical-align: middle; margin-right: 2px;}

.call_filmmaking {display: table;}



.showreel {padding: 80px 0;}

.showreel h2 {text-align: center; font-size: 42px; margin-bottom: 42px; font-weight: 600;}

.showreel iframe {width: 100%; height: 48.5vw;}

.service-item h3 {
    font-size: 16px;
    text-align: center;
    margin-top: 10px;
    margin-bottom: 6px;
}
.service-item p {font-size:14px;text-align:center;color:black;}
.service-item {
    background-color: #cdc7c7;
    padding: 3px;
    height: 310px;
	width:100%
}
.service-item img {width:100%;}
@media only screen and (max-width: 599px) {
.service-item {
    background-color: #cdc7c7;
    padding: 3px;
    height: 270px!important;
	width:100%;
	margin-bottom:10px;
}	
}