@charset "UTF-8";

 	
 .jumbotron { 
	 background: center no-repeat ;
	 background-size: cover ;
	 height: 40vh;
	 margin-bottom: 0 ;
	 padding-bottom: 0 ;
}

.jumbotron.identity {
	background:url(../identity/identity-img.jpg) center no-repeat;
}

.jumbotron.thanks {
	background:url(../img/thanks-bg.jpg) center no-repeat;
}

.jumbotron.sample {
	background:url(../sample/smple-img/sample-img.jpg) center no-repeat;
}

.jumbotron.price {
	background:url("../price/price-img.jpg") center no-repeat;
}

.jumbotron h1 {
	color: #FFF ;
	text-shadow: 1px 1px 2px #000 ;
	font-size: 4rem ;
	font-weight: bold ;
	letter-spacing: 0.2rem ;
}

.jumbotron h3 {
	color: #45aed6 ;
	text-shadow: 1px 1px 2px #000 ;
	font-size: 2rem ;
	font-weight: bold ;
}

.jumbotron p {
	color: #FFF ;
	text-shadow: 1px 1px 2px #000 ;
	font-size: 1.5rem ;
	line-height: 1.5 ;
}

#bread-menu {
border-bottom: 1px solid #eee;
	background-color: #FFF;
}

.breadcrumb {
  background:transparent;
  margin-bottom:-1px ;
  font-size: 1.5rem ;
}

.breadcrumb li+li:before {
  content:'»';
}

.breadcrumb li.active {
	font-weight: 700;
	color:#141414 ;
}

.breadcrumb li a {
	color: #45aed6 ;
}

.breadcrumb li a:hover {
	color: #141414 ;
}



.text-div {
	padding: 70px 0 ;
}

.bg-gray {
	background: #FAFAFA ;
}

.text-div .text-box {
	padding-right: 30px ;
}

.text-div h2 {
	font-size: 2.2rem ;
	font-weight: bold ;
	margin-bottom: 15px ;
	color: #45aed6 ;
	text-shadow: 1px 1px 1px rgba(0,0,0,0.2) ;
}

.text-div h5 {
	font-size: 1.5rem ;
	margin-bottom: 15px ;
	line-height: 1.5 ;
}

.text-div p {
	line-height: 1.8 ;
}

.sample-col {
	margin-bottom: 30px ;
}


.identity-bg-1 {
	background: url(../identity/identity-img2.jpg) no-repeat ;
	background-size: cover;
}

.identity-bg-2 {
	background: url(../identity/identity-img4.jpg) no-repeat ;
	background-size: cover;
}

.price-bg-1 {
	background: url("../price/price-img01.jpg") no-repeat ;
	background-size: cover;
}

.photo-div {
	padding: 70px 0;
}

.photo-div.identity-2 {
	background: #242a33 url(../identity/identity-img3.jpg) no-repeat 50% 50%;
	background-size: cover;
	background-attachment: fixed;
}

.photo-div.alsok-img {
	background: #242a33 url(../sample/alsok/alsok-img2.jpg) no-repeat 50% 50%;
	background-size: cover;
	background-attachment: fixed;
	height: 360px ;
}

.photo-div h2 {
	color: #45aed6 ;
	line-height: 1;
	text-shadow: 1px 1px 1px rgba(0,0,0,0.8) ;
	font-size: 2.2rem ;
	font-weight: bold ;
	margin-bottom: 15px ;
}

.photo-div p {
	color: #FFF ;
	line-height: 1.8 ;
}

#cta h2,
#cta2 h2,
#portfolio h2,
#features h2,
#pricing h2,
#karaoke h2,
#inquiry h2,
#get-in-touch h2,
#services h2,
#testimonial h2 {
	margin-top: 0;
	margin-bottom: 30px ;
	font-weight: bold ;
	text-shadow: 1px 1px 2px #ccc ;
	font-size: 3.4rem ;
}

#cta2 h2,
#pricing h2,
#get-in-touch h2,
#services h2,
#testimonial h2 {
	color: #fff;
	line-height: 1;
	text-shadow: 1px 1px 2px #000 ;
}

#cta2 h2 > span,
#pricing h2 > span,
#karaoke h2 > span,
#inquiry h2 > span,
#services h2 > span,
#testimonial h2 > span {
  color: #45aed6;
}

.cte-2-bg {
	background: url(../images/cta/cta-img.jpg) no-repeat;
}

.media-heading {
	color: #FFF;
	font-weight: bold ;
}

.media-heading > span {
	color: #45aed6 ;
	margin-right: 10px ;
}

.feature-bg {
	background: url(../img/flo-img.jpg) no-repeat ;
	padding-right: 30px ;
	opacity: 0.5 ;
	margin-bottom: 50px ;
}

.karaoke-img {
	margin-bottom: 30px ;
	text-align: center ;
}

.flow-div {
	margin-top: 50px ;
}

.blue-line {
	height:10px ;
	width: 100px ;
	border-top: 1px solid #45aed6 ;
	margin: 30px auto ;
}

.set-center {
	margin-top: 30px ;
	text-align: center ;
}

a.btn-primary::after {
	font-family: 'Font Awesome 5 Free';
    content: '\f138';
	padding-left: 0.8rem;
	font-weight: 900;
}

/*------------------------------------*\
	Portfolio
\*------------------------------------*/

.work {
    position: relative;
    padding: 20px;
	
}

.work>img {
  width: 100%;
}

.work .overlay {
    background: #1C1D21;
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    opacity: 0;
    -webkit-transition: 0.2s opacity;
    transition: 0.2s opacity;
    -webkit-transition-delay: 0.2s;
    transition-delay: 0.2s;
}

.work:hover .overlay {
    -webkit-transition-delay: 0s;
    transition-delay: 0s;
    opacity: 0.8;
}

.work .work-content {
    position: absolute;
    left: 25px;
    right: 25px;
    top: 50%;
    text-align: center;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

.work .work-content h3 {
    -webkit-transform: translateY(100%);
    -ms-transform: translateY(100%);
    transform: translateY(100%);
    opacity: 0;
    color: #FFF;
    margin-bottom: 10px;
    -webkit-transition: 0.2s all;
    transition: 0.2s all;
    -webkit-transition-delay: 0.1s;
    transition-delay: 0.1s;
	font-weight: bold ;
}

.work:hover .work-content h3 {
    -webkit-transform: translateY(0%);
    -ms-transform: translateY(0%);
    transform: translateY(0%);
    opacity: 1;
    -webkit-transition-delay: 0.1s;
    transition-delay: 0.1s;
}

.work .work-content span {
    display: block;
    text-transform: uppercase;
    -webkit-transform: translateY(100%);
    -ms-transform: translateY(100%);
    transform: translateY(100%);
    opacity: 0;
    color: #45aed6;
    margin-bottom: 5px;
    -webkit-transition: 0.2s all;
    transition: 0.2s all;
    -webkit-transition-delay: 0.2s;
    transition-delay: 0.2s;
	font-size: 1.8rem ;
}

.work:hover .work-content span {
    -webkit-transform: translateY(0%);
    -ms-transform: translateY(0%);
    transform: translateY(0%);
    opacity: 1;
    -webkit-transition-delay: 0s;
    transition-delay: 0s;
}

.work .work-link {
    text-align: center;
    margin-top: 20px;
    opacity: 0;
    -webkit-transition: 0.2s opacity;
    transition: 0.2s opacity;
}

.work .work-link a {
    display: inline-block;
    width: 50px;
    height: 50px;
    background-color: #45aed6;
	border: 1px solid #45aed6 ;
    color: #FFF;
    line-height: 50px;
    text-align: center;
}

.work .work-link a:hover {
	background: rgba(255,255,255,0.2) ;
	color: #45aed6 ;
}

.work:hover .work-link {
    -webkit-transition-delay: 0.2s;
    transition-delay: 0.2s;
    opacity: 1;
}



.address {
	padding: 20px ;
	text-align: center ;
	background: #45aed6 ;
	color: #FFF ;
	margin-bottom: 50px ;
}

.address h3 {
	font-weight: bold ;
	font-size: 3rem ;
	color: #FFF ;
	margin-bottom: 20px ;
}

.address h4 {
	font-size: 1.8rem ;
	margin-bottom: 30px ;
	color: #FFF ;
}

.address p.tel {
	font-family: 'Heebo', sans-serif;
	font-size: 5rem ;
}


/*------------------------------------*\
	prices
\*------------------------------------*/

.packages .package {
  background: #fff;
  margin-top: 25px;
  margin-bottom: 20px;
  padding-bottom: 15px;
  text-align: center;
  border: solid 1px #38a7bb;
  overflow: hidden;
}
.packages .package .package-header {
  /*height: 57px;*/
  /*color: #fff;*/
  /*line-height: 57px;*/
  background: #38a7bb;
}

.packages .package .package-header p {
	padding: 0 15px;
	line-height: 1.5 ;
	color: #3B3B3B ;
	font-size: 1.4rem ;
	text-align: left ;
}

.packages .package .package-header h5 {
  color: #fff;
  text-transform: uppercase;
  font-weight: bold;
  line-height: 30px;
  margin: 0;
  /*letter-spacing: 0.08em;*/
	font-size: 2rem !important ;
}
.packages .package .package-header.light-gray {
  background: #eeeeee;
	padding: 30px 0 20px ;
}
.packages .package .package-header.light-gray h5 {
  color: #555555;
}
.packages .package .price {
  line-height: 120px;
  height: 100px;
  color: #fff;
  font-weight: 400;
}
.packages .package .price h4 {
  display: inline;
  font-size: 50px;
  line-height: normal;
  margin-bottom: 0;
	font-weight: bold ;
}
.packages .package .price .period {
  line-height: normal;
  color: #999999;
}
.packages .package ul {
  padding: 0;
}
.packages .package ul li {
  list-style-type: none;
  padding-top: 10px;
  padding-bottom: 10px;
  width: 80%;
  margin: auto;
  border-bottom: 1px dotted #ccc;
}
.packages .package ul li:last-child {
  border-bottom: 0;
}
.packages .package ul li i {
  font-size: 13px;
  margin-right: 5px;
}
.packages .best-value .package {
  margin-top: 0;
  padding-bottom: 40px;
}
.packages .best-value .package .package-header {
  height: 72px;
  padding-top: 17px;
  height: 82px !important;
}
.packages .best-value .package .package-header h5 {
  font-weight: bold;
  line-height: 29px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}
.packages .best-value .package .package-header .meta-text {
  font-size: 13px;
  line-height: 15px;
}

/***********************
********* Footer ******
************************/
#footer {
  padding-top: 50px;
  padding-bottom: 50px;
  color: #fff;
  background: #2e2e2e;
}
#footer a {
  color: #fff;
}
#footer a:hover {
  color: #45aed6;
}

.footer-logo img {
	max-width: 300px ;
	margin-bottom: 20px ;
}

.footer-logo h3 {
	font-size: 1.4rem ;
	line-height: 1.5 ;
	color: #FFF ;
}

.footer-logo p {
	font-size: 1.4rem ;
	line-height: 1.5 ;
}

.footer-banner img {
	max-width: 240px ;
	margin: 0 auto 15px ;
	transition: 0.3s ;
}

.footer-banner img:hover {
	opacity: 0.7 ;
}


#footer ul {
  list-style: none;
  padding: 0;
	
}

#footer ul li {
	border-bottom: 1px dotted #666 ;
	font-size: 1.3rem ;
}

#footer ul > li a {
  display: block ;
	padding: 3px 10px ;
}

#footer ul > li a::before {
	font-family: 'Font Awesome 5 Free';
    content: '\f138';
	padding-right: 0.8rem;
	font-weight: 900;
}

#main-contact-form select {
	margin-bottom: 30px ;
}

select .text-lg {
	font-size: 2rem ;
}

.row-eq-height {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

.mb30 {
	margin-bottom: 30px ;
}

.p0 {
	padding-left: 0 ;
	padding-right: 0 ;
}

/* Hover Effect */
.hovereffect {
	width:100%;
	height:100%;
	float:left;
	overflow:hidden;
	position:relative;
	text-align:center;
	cursor:default;
}

.hovereffect .overlay {
	width:100%;
	height:100%;
	position:absolute;
	overflow:hidden;
	top:0;
	left:0;
	opacity:0;
	background-color:rgba(0,0,0,0.5);
	-webkit-transition:all .4s ease-in-out;
	transition:all .4s ease-in-out
}

	.hovereffect img {
	display:block;
	position:relative;
	-webkit-transition:all .4s linear;
	transition:all .4s linear;
}

.hovereffect h2 {
	text-transform:uppercase;
	color:#fff;
	text-align:center;
	position:relative;
	font-size:16px;
	background:rgba(0,0,0,0.6);
	-webkit-transform:translatey(-100px);
	-ms-transform:translatey(-100px);
	transform:translatey(-100px);
	-webkit-transition:all .2s ease-in-out;
	transition:all .2s ease-in-out;
	padding:10px;
}

.hovereffect h3 {
	color:#fff;
	font-size: 15px ;
	font-weight: bold ;
}

.hovereffect a.info {
	text-decoration:none;
	display:inline-block;
	text-transform:uppercase;
	color:#fff;
	border:1px solid #45aed6;
	background-color: #45aed6;
	opacity:0;
	filter:alpha(opacity=0);
	-webkit-transition:all .2s ease-in-out;
	transition:all .2s ease-in-out;
	margin: 15px 0 0;
	padding:5px 10px;
}

.hovereffect a.info::after {
	font-family: 'Font Awesome 5 Free';
    content: '\f138';
	padding-left: 0.8rem;
	font-weight: 900;
}

.hovereffect a.info:hover {
	box-shadow:0 0 5px #fff;
	border-color: #FFF ;
	background-color: transparent ;
}

.hovereffect:hover img {
	-ms-transform:scale(1.2);
	-webkit-transform:scale(1.2);
	transform:scale(1.2);
}

.hovereffect:hover .overlay {
	opacity:1;
	filter:alpha(opacity=100);
}

.hovereffect:hover h2,.hovereffect:hover a.info {
	opacity:1;
	filter:alpha(opacity=100);
	-ms-transform:translatey(0);
	-webkit-transform:translatey(0);
	transform:translatey(0);
}

.hovereffect:hover a.info {
	-webkit-transition-delay:.2s;
	transition-delay:.2s;
}

.sample-music-col {
	border: 1px solid #DDD ;
	padding: 5px ;
	background: #FEFEFE ;
	overflow: hidden ;
	margin-bottom: 30px ;
}

.sample-music-col i {
	float: left ;
	background: #45aed6 ;
	color: #FFF ;
	border-radius: 3px ;
	padding: 10px 15px ;
	font-size: 3rem ;
	margin-right: 10px ;
}

.sample-music-col:hover {
	text-decoration: none;
	background-color: #FAFAFA ;
}

.sample-music-col h5,
.sample-music-col p {
	line-height: 0.8 ;
}

.sample-music-col h5 {
	font-size: 1.5rem ;
}

.sample-music-col p {
	font-size: 1.2rem ;
	font-weight: bold ;
	margin-bottom: 0 ;
}

.interview-title {
	color: #555 ;
	font-weight: bold ;
	margin-top: 30px ;
}

.interview-photo {
	float: right ;
	padding: 5px ;
	border: 1px solid #DDD ;
	margin: 15px 0 10px 15px ;
}

.interview-photo p {
	font-size: 1.2rem ;
	line-height: 1.4 ;
	margin-bottom: 0 ;
	margin-top: 5px ;
	text-align: right ;
}

.youtube {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
	margin-bottom: 30px ;
}
.youtube iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100% !important;
  height: 100% !important;
}

.mt50 {
	margin-top: 50px ;
}