@import url(font-awesome.min.css);
@import url(bootstrap.css);
@import url('owl.carousel.css'); 
@import url('owl.theme.css'); 
@import url('owl.transitions.css'); 
@import url('jquery.fancybox.min.css'); 

body{font-family: 'Changa', sans-serif;}
header{float:left; width:100%;}
section{float:left; width:100%;}
footer{float:left; width:100%;}
p{font-family: 'Roboto', sans-serif; letter-spacing:0.9px;}

.top_header{background:#222222; padding:15px 0;}
.top_no p{color:#fff; margin:0px; padding:0px;}
.social_top{float:right;}
.social_top h6{color:#fff; font-size:18px; float:left; margin:0px; padding:0px;}
.social_top i{color:#fff; float:left; margin-left:10px; margin-top:3px;}
.menu{position:absolute; z-index:99; width:100%;}
.fixed{background:#222222; position:fixed; top:0; left:0; animation:smoothScroll 1s forwards;}
@keyframes smoothScroll {
	0% {
		transform: translateY(-40px);
	}
	100% {
		transform: translateY(0px);
	}
}
.navbar{min-height:auto; margin:0px;}
.navbar-brand img{width:150px;}
.navbar-brand{height:auto; padding:0px;}
.navbar-nav{margin-top:20px;}
.navbar-default{background:none; border:none;}
.navbar-default .navbar-nav > li > a{color:#fff; font-size:16px; text-transform:uppercase;}
.navbar-default .navbar-nav > li > a:hover, .navbar-default .navbar-nav > li > a:focus{color:#ff3300;}
.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:hover, .navbar-default .navbar-nav > .active > a:focus{background:none;color:#ff3300;}

/*-------------------------------------------
-----------------------------------------------------
Slider
----------------------------------------------------
---------------------------------------------------------*/
.home-slider{background:#000;}
.home-slider img{opacity:0.6;}


/*-------------------------------------------
-----------------------------------------------------
Home About
----------------------------------------------------
---------------------------------------------------------*/
.home-about{background:url(../images/about.jpg) no-repeat; background-position:50% -9px; background-attachment:fixed; background-size:cover; padding:150px 0 100px; position:relative;}

.with_frame_image{position:relative; display:inline-block;}
.with_frame_image::before{content:""; position:absolute; top:-40px; left:-40px; width:100%; height:100%; border:4px solid #dd4377; border-radius:5px; z-index:1;}
.with_frame_image img{z-index:2; position:relative;}
.rounded{border-radius: 5px;}
.with_line{position:relative; display:inline-block; z-index:1; padding:0 20px;}
h2.section_header{color:#fff; margin-bottom: 30px; font-size:40px; position:relative; word-wrap:break-word; line-height:0.9; font-weight:400; z-index:1;}
h2.section_header.with_line{padding:0 40px;}
.with_line::before{content:""; position:absolute; top:50%; height:2px; left:0; right:0; background-color:#dd4377; z-index:-1;}
.home-about p{color:#fff; font-size:17px; line-height:25px;}
.abouttext{margin-top:60px;}

/*-------------------------------------------
-----------------------------------------------------
Home Music Education
----------------------------------------------------
---------------------------------------------------------*/
.musiceducation{background:#1a1a1a; padding:80px 0; text-align:center;}
.subbox{margin-top:30px;}
.subbox h3{background:#ff3300; text-align:center; padding:20px 0; color:#fff; margin:0px;}
.musibox{background:#9e9896; padding:30px; min-height:320px;}
.musibox p{font-size:15px; color:#181616; line-height:25px; text-align:left;}

/*-------------------------------------------
-----------------------------------------------------
Home Contact
----------------------------------------------------
---------------------------------------------------------*/
.home-contact{background:url(../images/contact.jpg) no-repeat; background-position:center; background-attachment:fixed; background-size:cover; padding:150px 0 100px; position:relative; text-align:center;}
.home-contact p{color:#fff; margin-bottom:50px;}
.home-contact ul{margin:0px; padding:0px;}
.home-contact ul li{display:block; list-style:none;}
.home-contact ul li i{font-size:20px; color:#fff; background:#ff3300; border-radius:50%; width:40px; height:40px; line-height:40px;}
.home-contact ul li h4{text-transform:uppercase; color:#fff;}
.home-contact ul li a{color:#fff;}

/*-------------------------------------------
-----------------------------------------------------
Footer
----------------------------------------------------
---------------------------------------------------------*/
footer{background:#1a1a1a; padding:20px 0; text-align:center;}
footer p{margin:0px; padding:0px; color:#595959;}







/*-------------------------------------------
-----------------------------------------------------
Inner Banner Common
----------------------------------------------------
---------------------------------------------------------*/
.inner_banner{width:100%; background:#000;}
.inner_banner img{width:100%; opacity:0.6}

/*-------------------------------------------
-----------------------------------------------------
Facility Page
----------------------------------------------------
---------------------------------------------------------*/
.faculty_box{background:#1a1a1a; padding:60px 0;}
.board-member{width:80vw; height:400px;}
.member-name{padding:0 40px; position:relative;}
.board-member__wrapper{margin-top:130px;}
.board-member__wrapper.row{-webkit-flex-direction: row-reverse; flex-direction:row-reverse;}
.faculty_box .row{display:-webkit-flex; display:flex; -webkit-flex-wrap:wrap; flex-wrap:wrap; margin-right:-15px; margin-left:-15px;}
.board-member{display:-webkit-flex; display:flex; position:relative; background-color:#9e9896;}
.board-member{width:80vw; height:400px;}
.member-image-container{padding:0 190px; position:relative; margin-left:50px;}
.member-image-wrapper{position:absolute; left:0; top:-42px;}
.member-image-wrapper{box-shadow:12px -12px #fc8e73;}
.member-image{width:320px !important; height:380px !important;}
.member-detail{padding:60px; text-align:left;}
.board-member__wrapper.row.reverse{-webkit-flex-direction:row; flex-direction:row;}
.board-member.reverse{-webkit-flex-direction:row-reverse; flex-direction:row-reverse;}
.member-name__graphic--block.reverse{left:16px;}
.member-image-wrapper.reverse{box-shadow:-12px -12px #fc8e73;}
.faculty_box h2{color:#fff; text-align:center; padding:0 150px;}

/*-------------------------------------------
-----------------------------------------------------
Galley Page
----------------------------------------------------
---------------------------------------------------------*/
.proimag{margin-bottom:30px;}
.home-about.gallery{padding:60px 0;}

/*-------------------------------------------
-----------------------------------------------------
Contact Page
----------------------------------------------------
---------------------------------------------------------*/
.contactbody{background:#1a1a1a; text-align:center; padding:60px 0;}
.contbox i{color:#ff3300; font-size:35px; margin-bottom:30px;}
.contbox p{font-size:15px; color:#b2b2b2;}
.contbox p > span{color:#fff;}

.contactfrm{width:100%; float:left; margin-top:50px;}
.contact-form p{margin-bottom:10px; position:relative;}
.form-group{position:relative;}
.form-group i{color:#ff3300;  position:absolute; font-size:14px !important; left:20px; top:17px; width:1em; line-height:1; text-align:center;}
.form-group input[type="text"], 
.form-group input[type="email"], 
.form-group textarea{height: 50px; background-color:transparent; border-radius:3px; box-shadow:none; color:#fff; padding:20px 20px 20px 40px; font-size:14px; line-height:26px; font-weight:400;
border:1px solid #fff; width:100%;}
.form-group textarea{min-height:180px; padding-top:9px;}
.contactfrm input[type="submit"]{background:#ff3300; color:#fff; border:1px #ff3300 solid; text-transform:uppercase; margin-top:30px; padding:13px 30px; border-radius:5px;}
.contactfrm input[type="submit"]:hover{background:none; color:#ff3300;}
.map {
    -webkit-filter: grayscale(100%);
       -moz-filter: grayscale(100%);
        -ms-filter: grayscale(100%);
         -o-filter: grayscale(100%);
            filter: grayscale(100%);
}
label.error{color:#FF3300 !important;}