/*
 * Theme Name: CM Theme
 * Description: Custom Theme
 * Theme URI: http://www.communitymusician.com/ 
 * Author: Shiv Gulam Singh
 * Version: 1.0
 */

@charset "utf-8";

:root {
--cm-blue:#214665;
--cm-indigo:#6610f2;
--cm-purple:#6f42c1;
--cm-pink:#d63384;
--cm-red:#ef4136;
--cm-orange:#f0673b;
--cm-yellow:#ffc107;
--cm-green:#63F79F;
--cm-teal:#20c997;
--cm-cyan:#0dcaf0;
--cm-white:#ffffff;
--cm-black:#000;
--cm-gray:#6c757d;
--cm-gray-dark:#263746;
--cm-primary:#0d6efd;
--cm-secondary:#6c757d;
--cm-success:#198754;
--cm-info:#0dcaf0;
--cm-warning:#ffc107;
--cm-danger:#dc3545;
--cm-light:#f8f9fa;
--cm-dark:#212529;
--cm-font-sans-serif:"Montserrat", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
--cm-font-monospace:"Montserrat", SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
--cm-gradient:linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));
--cm-transition:.5s linear;
--cm-background:#fff;
--cm-font-size:1.125rem;
--cm-border-radius:15px;
--cm-box-shadow:0 0 10px #ccc;
}

@font-face{font-family:'Cera-Bold';src:url('../fonts/CeraPro-Bold.woff2') format('woff2'), url('../fonts/CeraPro-Bold.woff') format('woff');font-weight:700;font-style:normal;font-display:swap;}
@font-face{font-family:'Cera-Light';src:url('../fonts/CeraPro-Light.woff2') format('woff2'), url('../fonts/CeraPro-Light.woff') format('woff');font-weight:300;font-style:normal;font-display:swap;}
@font-face{font-family:'Cera-Regular';src:url('../fonts/CeraPro-Regular.woff2') format('woff2'), url('../fonts/CeraPro-Regular.woff') format('woff');font-weight:400;font-style:normal;font-display:swap;}

html{background:var(--cm-background) !important;scroll-behavior:smooth;scroll-padding-top:100px;}
body{background:var(--cm-background) !important;font-family:'Cera-Regular';font-size:var(--cm-font-size);font-weight:400;line-height:1.5;overflow-x:hidden;transition:var(--cm-transition);
color:var(--cm-gray-dark);}
.img-responsive{width:100%;height:auto}
a{color:var(--cm-orange);transition:var(--cm-transition);outline:none;text-decoration:none}
a:hover{color:var(--cm-blue);}

p:empty{display:none}
.br{display:none}

.clear,.clr{clear:both;height:1px;overflow:auto}
h1,h2,h3,h4,h5,h6{padding:0;margin:0;color:var(--cm-black);font-family:'Cera-Bold';}
.dark-gray{color:#666;}
ul,ol{list-style:none}
ul,ol,p{margin:0;padding:0;}
ul li,ol li{margin:0;padding:0}
.align-right{text-align:right}
.relative{position:relative}
.align-center{text-align:center}

::placeholder{color:#737373;font-weight:400 !important;opacity:1;transition:transform 250ms, opacity 400ms;}
:focus::placeholder,
:hover::placeholder{opacity:0;}


.header{clear:both;transition:var(--cm-transition);background:#fff;padding:15px 0}

.header-left{float:left;text-align:left;width:250px}
.header-left img{width:300px;height:auto;margin:0;}
.header-right{float:right;text-align:right;margin:0;width:calc(100% - 300px);position:relative}

.header.sticky{position:fixed;box-shadow:0 1px 10px 0 rgba(75,75,75,.3);top:0;left:0;right:0;z-index:999;padding:5px 0}

.menu-click{position:absolute;top:1rem;right:5px;z-index:9999;cursor:pointer}
.menu-click .bar1, .menu-click .bar2, .menu-click .bar3{width:25px;height:2px;background-color:#263746;margin:6px 0;transition:var(--cm-transition);display:block}
.menu-click.on .bar1{-webkit-transform:rotate(-45deg) translate(-9px, 6px);transform:rotate(-45deg) translate(-4px, 6px);background-color:#f0673b;}
.menu-click.on .bar2{opacity:0;}
.menu-click.on .bar3{-webkit-transform:rotate(45deg) translate(-8px, -8px);transform:rotate(45deg) translate(-6px, -7px);background-color:#f0673b;}

.menu-container{display:none;position:fixed;left:0;top:0;width:100%;height:calc(100vh);background-color:rgba(0,0,0,.95);line-height:normal;animation:fadeIn 1s linear;z-index:999;}
.menu-container ul{list-style:none;text-align:center;position:relative;top:50%;transform:translateY(-50%);}
.menu-container li{display:block;padding:1rem 0}
.menu-container li a{color:var(--cm-white);font-size:1rem;text-transform:uppercase;font-weight:500}
.menu-container li a:hover,
.menu-container li a.menu-active{color:var(--cm-orange);}



.bg{background:linear-gradient(#F15B2F, #f15800);padding:5px 0 0 0;position:relative}

.bg h1{color:var(--cm-white);font-size:3.5rem;line-height:normal;padding:1.5rem 0 0 0;letter-spacing:1px}
.bg h2{color:var(--cm-white);font-size:2rem;line-height:45px;/*display:inline-block;*/padding:1rem 0 1.5rem 0}
.bg h2+p{color:var(--cm-white);font-size:1.5rem;padding:1rem 0 1.5rem 0;/*border-top:1px solid #fff;*/display:inline-block}

.scroll-button{width:45px;height:auto;position:absolute;bottom:10px;left:49%;z-index:999;cursor:pointer; border-radius:50%;-webkit-animation:scroll-button 4s ease-in-out infinite;animation:scroll-button 4s ease-in-out infinite}
@-webkit-keyframes scroll-button {
0%{-webkit-transform:translate(0,-10px);opacity:0}
50%{opacity:1}
100%{-webkit-transform:translate(0,10px);opacity:0}
}
@keyframes scroll-button {
0%{transform:translate(0,-10px);opacity:0}
50%{opacity:1}
100%{transform:translate(0,10px);opacity:0}
}

.more{display:inline-block;background:#242424;padding:1rem 2rem;color:var(--cm-white);border-radius:4px;font-weight:bold}
.more:hover{background:#fff;color:var(--cm-black)}

.more2{background:#F67917;}
.more2:hover{background:#242424;color:var(--cm-white)}

.form-bg{}
.form-bg{background:#fff;border-radius:10px;padding:1rem}
.form-bg h3{position:relative;padding:0 0 1.5rem 0;font-size:1.75rem;color:#000;text-align:left}
.form-bg p{padding-bottom:1.5rem}

.form-bg iframe,
.meetings-iframe-container{width:100% !important;max-width:100% !important}

.music{margin-bottom:1rem}
.music img{margin-left:0;width:100%;height:100%}
.music-bottom{background:url(../images/design-bottom.png) top center no-repeat;background-size:cover;height:273px;margin-top:0rem;}

.banner{padding:0;margin-top:-3rem;position:relative}

.video{background:#000;width:100%;height:300px}

.revenue{padding:2rem 0 0 0;color:#575757;text-align:center}
.revenue h3{font-size:2.5rem;border-bottom:2px solid #FF6B48;padding-bottom:10px;margin-bottom:10px}
.revenue p{font-size:1.25rem;line-height:1.1}
.revenue span{font-size:1rem;font-weight:700}

.music-top{width:100%;height:100%;margin-top:3rem;}

.market{padding:2rem 0}
.market p{font-size:1.25rem}
.box{background:#f6f6f6;padding:2rem;position:relative;}
.box img{position:absolute;top:-1rem;left:-1rem;width:auto;height:115px}
.box h2{color:#ff672d;padding:4rem 0 1rem 0;font-size:2rem}
.music2{width:100%;height:100%;padding:10px 0}
.music-industry{width:100%;height:100%}
.remark{background:#bfbfbf;border-radius:75px 0 75px 0;padding:2rem;margin:10px 0 0 0;}
.remark h2,
.management h2,
.opportunity h2{font-size:2rem;padding:0 0 1rem 0}
.model{width:100%;height:100%;margin:10px 0}
.management{background:#eaeaea;border-radius:75px 0 75px 0;padding:2rem;margin:20px 0 0 0;}
.team{margin:0;padding:1.5rem 0;text-align:center}
.team h3{font-size:1rem;text-transform:uppercase;color:#606060;padding:1rem 0}
.team li{padding:15px 0;border-bottom:1px solid rgba(252,214,188);}
.team li img{width:100%;height:100%}
.team li:last-child{border-bottom:none}
.space{padding:0 0 0 0}
.opportunity{padding:0rem 0 0 0}
.img{width:100%;height:100%;}





.footer-top{background:url(../images/footer-design-top.png) top center no-repeat;background-size:cover;height:472px;margin-top:-8rem}

.footer-bg{background:linear-gradient(#f15a2d, #e23e26);color:var(--cm-white);margin:-6rem 0 0 0}
.footer-bg h3{text-align:center;color:var(--cm-white);font-size:3rem;padding:0 0 2rem 0}
.footer-bg .owl-carousel{text-align:center;color:var(--cm-white)}
.footer-bg .owl-carousel .owl-item img{width:auto !important;height:auto !important;display:inline-block !important}
.footer-bg .owl-carousel .owl-item .testimonial-text{padding:1rem 0}

.footer-bg .owl-carousel .owl-nav button.owl-prev{background:url(../images/icon-arrow-back.svg);width:14px;height:23px;position:absolute;right:-2rem;top:50%}
.footer-bg .owl-carousel .owl-nav button.owl-next{background:url(../images/icon-arrow-back.svg);width:14px;height:23px;position:absolute;left:-2rem;top:50%;transform:rotate(180deg);}

.footer-bg .align-center{padding:2rem 0;}
.footer-bg .align-center img{width:100%;height:100%;}

.footer-bg h4{color:var(--cm-white);font-size:3rem;padding:0 0 0 0}
.footer-bg p{padding-bottom:1.5rem}
.footer-bg h4+p+p strong{font-size:1.5rem}



.go-up{opacity:0;}
.go-up a{background:url(../images/go-up.png) center center no-repeat #fff;border:1px solid #F15B2F;position:fixed;right:10px;bottom:50px;display:inline-block;width:35px;height:35px;transition:var(--be-transition);z-index:99;border-radius:50%;padding:10px}
.go-up.go-up-show{opacity:1;}

.footer-container{background:#000;text-align:center;color:var(--cm-white);padding:1rem 0;position:relative;z-index:9}
.footer-container br{display:block}

@media screen and (max-width: 666px) {
	
}

@media only screen and (min-width: 600px) and (orientation : landscape) and (-webkit-min-device-pixel-ratio: 2) and (min-resolution: 192dpi) {

}

@media only screen and (max-width: 600px) and (orientation : portrait) {

}

@media only screen and (min-width: 600px) and (orientation : landscape) {

}

@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) {

.bg h1{padding:12rem 0 0 0;}
.bg h2{font-size:1.5rem;line-height:2.5rem}

.form-bg h3{padding-top:2rem}

.box h2,
.remark h2,
.management h2,
.opportunity h2{font-size:1.5rem;}

.market p{font-size:1rem}
.music-top{margin:1rem auto 0 auto;width:auto;height:auto;}
.music2,
.music-industry,
.model{width:100%;height:auto}
.box{padding:1rem}
.remark{padding:1rem;border-radius:50px 0 50px 0;}
.management{padding:1rem;border-radius:50px 0 50px 0;margin:0}

.team li{text-align:center}
.team li img{width:auto;height:auto}

.opportunity{padding:0}
.img{width:100%;height:auto;}

.space{padding:2rem 0 0 0}

.footer-top{margin-top:-8rem}

.footer-bg .align-center{padding:3rem 0 0 0;}
}




@media only screen and (min-width: 768px) and (max-width: 1366px) {
	
}


@media only screen and (min-width: 1100px) {
.menu-click,
.menu-close{display:none}

.menu-container{display:block;background:none;position:relative;right:0;top:0;height:auto;z-index:99}
.menu-container ul{top:0;transform:translateY(0);text-align:right;padding-top:0}
.menu-container li{display:inline-block;border-right:1px solid #ccc;margin:0 8px 0 0;padding:0 10px 0 0}
.menu-container li a{color:var(--cm-gray-dark);}

.menu-container li:last-child{border-right:none;padding-right:0}
}



@media only screen and (min-width: 992px) {

/*html{scroll-padding-top:100px;}*/

.br{display:block}	

.bg{padding:2rem 0 0 0}

.header{}

.header-left{width:350px}
.header-left img{width:auto;height:auto;margin:0}
.header-right{width:calc(100% - 350px);text-align:right;padding:1.5rem 0 0 0}

.header.sticky{padding:10px 0}


.bg h1{padding:4rem 0 0 0;font-size:5.5rem;}
.bg h2{font-size:2rem;line-height:2.5rem;/*display:inline-block;*/padding:1rem 0 1.5rem 0;}
.bg h2+p{font-size:1.15rem;padding:1rem 0 1.5rem 0;font-weight:bold}


.music{margin-bottom:-15rem}
.music img{margin-left:-3rem;width:auto;height:auto}

.banner{padding:3rem 0;margin:0}
.video{height:450px}
.revenue{padding:15rem 0 0 0;}
.revenue h3{font-size:3rem;}
.music-top{position:absolute;top:-20rem;right:-5rem;width:auto;height:300;margin-top:0}

.form-bg{padding:2rem;margin-top:4rem;}

.form-bg h3{font-size:2.5rem;}

.market{padding:3rem 0 0 0}
.box{padding:2rem;}
.box h2{padding:4rem 0 1rem 0;}
.music2{padding:5rem 0 0 0}
.remark{padding:3.5rem 3rem;margin:10px 0 0 -1rem;}
.model{margin:10px 0 0 0}
.management{padding:3.5rem 4rem;margin:-8px -8px 0 0;}
.team{padding:1.5rem 0;}
.team li{display:inline-block;vertical-align:top;width:calc(28% - 32px);padding:0 15px;border-right:1px solid rgba(244,129,56,.5);border-bottom:none;min-height:270px}
.team li img{width:100%;height:100%}
.team li:last-child{border-right:none}
.opportunity{padding:8rem 0 0 0}
.img{}

.space{padding:3rem 0}

.footer-top{margin-top:0}
.footer-bg{margin:-5rem 0 0 0}
.footer-bg .align-center{padding:3rem 0 0 0;}
.footer-bg .align-center img{width:100%;height:auto;margin-bottom:-2px}

.footer-bg h4{padding:0}
.footer-bg p{border-left:1px solid #fff;font-size:2rem;font-weight:500;padding:0 0 0 3.5rem}
.subscribe-form{margin-top:2rem}
.footer-container br{display:none}

}


/*-- XR iOS 12 --*/
@media only screen and (min-device-width: 414px) and (max-device-height: 896px) and (orientation : landscape) and (-webkit-device-pixel-ratio: 2){

}

/*-- XS Max iOS 12 --*/
@media only screen and (min-device-width: 414px) and (max-device-height: 896px) and (orientation : landscape) and (-webkit-device-pixel-ratio: 3){

}

@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) and (min-device-height : 768px){

}


@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) and (min-device-height : 768px){
.remark,
.management{padding:2rem}
.model{width:100%;height:auto}	
.footer-top{margin-top:-6rem}
}


@media only screen and (min-device-width : 810px) and (max-device-width : 1080px) and (orientation : landscape) and (min-device-height : 810px){
.remark,
.management{padding:2rem}
.model{width:100%;height:auto}	
.footer-top{margin-top:-6rem}
}

/*@media only screen and (min-device-width : 1024px) and (max-device-width : 1366px) and (orientation : landscape) and (min-device-height : 810px){
.bg .col-md-4{width:33.3333333333% !important}
.bg .col-md-8{width:66.6666666667% !important}	
}*/


@media only screen and (min-width: 1366px) {
.box{padding:3rem 2rem;}
.management{margin:-2px -8px 0 0;}
.team{padding:2rem 0;}
.opportunity{padding:10rem 0 0 0}
}

@media only screen and (min-width: 1400px) {
.management{margin:-8px -8px 0 0;}
.opportunity{padding:10rem 0 0 0}
}