@import 'https://fonts.googleapis.com/css?family=Lora:400,400i,700|Raleway:300,600,700,900';

@import 'https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css';

/*Global Settings*/

body{

	font-family: 'Lora', serif;
	overflow: hidden;
}
body.display-none{

	font-family: 'Lora', serif;
	overflow-y: scroll;
	overflow-x: hidden;
}

/* Loader */

.loader{
	
	position : fixed;
	display: block;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	text-align: center;
	z-index: 300;
	background : white url(../images/Loader.gif) no-repeat center;
}

/* Loader-END */


/* splash */

@font-face {
	font-family: 'SF';
	src: url("../font/sf-ui-display-thin-58646e9b26e8b.otf");
}

.splash{
   
   position : fixed;
   display: block;
   top: 0;
   left: 0;
   height: 100%;
   width: 100%;
   text-align: center;
   z-index: 200;
   background-image: linear-gradient(-40deg, #393D75, #E87185);
   line-height: 55vh;

}

.splash.display-none{
   
	position : fixed;
	top: 0;
	opacity: 0;
	left: 0;
	height: 100%;
	width: 100%;
	text-align: center;
	z-index: -10;
	background-image: linear-gradient(-40deg, #393D75, #E87185);
	line-height: 55vh;
	transition: all 1s ease-out;
	
 
 }

.splash h1{
	
	color: white;
	font: 45px 'SF';	
}

.splash img {
 
	padding-bottom: 0;
	height: 150px;
	width: 250px;
	margin-top: 130px;
}

@keyframes slideIn{

	to{
		opacity: 1;
	}
}

@keyframes slideIn2{

	to{
		opacity: 1;
		transform: none;
	}
}

.slide-in {
	opacity: 0;
	animation: slideIn 1s ease-in forwards;
}

.slide-in2 {
	opacity: 0;
	transform: translate3d(0, 100%, 0);
	animation: slideIn2 1.2s ease-in forwards;
}

/* splash- END */

h1, h2, h3, h4, h5, h6{

	font-family: 'Raleway', sans-serif;

	text-transform: uppercase;

	font-weight: 900;

	color: #424242;

	margin-bottom: 35px;

	margin-top: 0;

}

h1{

	font-size: 45px;

}

h2{

	font-size: 32px;

}

h3{

	font-size: 21px;

}

p{

	font-size: 16px;

	font-style: italic;

	color: #818181;

}

a{

	transition: all 0.3s ease-in-out;

}

section{

	text-align: center;

}

.blockquote p{

	font-size: 32px;

	line-height: 45px;

	padding-left: 30px;

	border-left: 3px solid #424242;

	color: #424242;

}

/* Scroll */

::-webkit-scrollbar-track
{
	-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
	background-color: #F5F5F5;
}

::-webkit-scrollbar
{
	width: 10px;
	background-color: #F5F5F5;
}

::-webkit-scrollbar-thumb
{
	background-color: #c2b340;	
	background-image: -webkit-linear-gradient(45deg,
	                                          rgba(255, 255, 255, .2) 25%,
											  transparent 25%,
											  transparent 50%,
											  rgba(255, 255, 255, .2) 50%,
											  rgba(255, 255, 255, .2) 75%,
											  transparent 75%,
											  transparent)
}

/* Scroll-End*/

.title{

	position: relative;

	margin-bottom: 100px;

}

.title:after{

	content: '';

	height: 5px;

	width: 40px;

	background-color: #62aa94;

	position: absolute;

	top: 81px;

	left: calc(50% - 20px);

}



/*Bootstrap*/

.navbar-ubutia{

	background-image: none;

	background-color: transparent;

	margin-bottom: 0;

	border-radius: 0;

	border-color: transparent;

	transition: all 0.3s ease-in-out;

}

.form-control option{

	color: #424242;

}

.form-control{

	border-radius: 0;

	padding: 25px;

    font-size: 18px;

    font-style: italic;

    background-color: transparent;

    color: #424242;

    margin-bottom: 30px;

	border-color: #51c2b9;

}

.form-control:focus{

	border-color: #51c2b9;

	box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(81, 194, 185, 0.6);

}

.form-control::-webkit-input-placeholder {

    color: #fff;

}

.form-control:-moz-placeholder { /* Firefox 18- */

    color: #fff;  

}

.form-control::-moz-placeholder {  /* Firefox 19+ */

    color: #fff;  

}

.form-control:-ms-input-placeholder {  

    color: #fff;  

}



.element .form-control::-webkit-input-placeholder {

    color: #424242;

}

.element .form-control:-moz-placeholder { /* Firefox 18- */

    color: #424242;  

}

.element .form-control::-moz-placeholder {  /* Firefox 19+ */

    color: #424242;  

}

.element .form-control:-ms-input-placeholder {  

    color: #424242;  

}









/*Helper class*/

.mt80{

	margin-top: 80px;

}

.mb80{

	margin-bottom: 80px;

}

.mr60{

	margin-right: 60px;

}

.bg-img{

	background-size: cover;

	background-repeat: no-repeat;

	position: relative;

}

.bg-img div{

	z-index: 1;

	position: relative;

}

.bg-img:after{

	position: absolute;

	content: '';

	height: 100%;

	width: 100%;

	background-color: rgba(0, 0, 0, 0.5);

	left: 0;

	top: 0;

}

.section{

	padding: 100px 0;

}

.ubutia-icon{

	background:transparent url(../images/logo.gif) no-repeat;

    width: 187px;

    height: 68px;

	display:block;

}

.play-icon{

	background:transparent url(../images/video-play-icon.png) no-repeat;

    width: 70px;

    height: 69px;

	display:block;

}

/*ubutia Card*/

.ubutia-card{

	text-align: center;

	/*margin-bottom: 45px;*/

}

.ubutia-card .ubutia-card-header{

	margin-bottom: 45px;

}

.ubutia-card .ubutia-card-header .card-icon{

	border-radius: 100%;

	display: inline-block;

	height: 120px;

	width: 120px;

	line-height: 120px;

	position: relative;

}
.ubutia-card-content a {
	
	text-decoration: none;
}







/*Button*/

.ubutia-btn{

	border-color: #51c2b9;

	font-style: italic;

	color: #51c2b9;

	border-radius: 0;

	letter-spacing: 3px;

	padding: 15px 80px;

	margin-bottom: 30px;

	background-color: transparent;

	transition: all 0.3s ease-in-out;

}

.ubutia-btn:hover{

	background-color: #51c2b9;

	color: #fff;

}

.solid{

	background-color: #51c2b9;

	color: #fff;

}

.solid:hover{

	background-color: #fff;

	color: #51c2b9;

}

.small-btn{

	padding: 10px 130px;

}



/*Element page*/

.element .navigation-bar{

	border-bottom: 1px solid rgba(0, 0, 0, 0.2);

}

.element .navigation-bar a{

	color: #424242;

}

.element .dark-bar{

	background-color: #fff;

}

.element .menu:after{

	color: #424242;

}

.element .title:after{

	left: 0;

	top: 60px;

}

.headings p{

	margin-bottom: 80px;

}

.social-icons ul{

	text-align: center;

	padding-left: 0;

	display: inline-block;

}

.social-icons ul a li{

	display: inline-block;

	list-style-type: none;

    border: 2px solid #51c2b9;

    margin-right: 10px;

    background-color: #51c2b9;

    color: #fff;

	font-size: 18px;

    line-height: 32px;

    width: 36px;

}

.social-icons ul a li:last-child{

	margin-right: 0;

}

.social-icons ul a:hover li{

	color: #51c2b9;

	background-color: #fff;

}

















/*Navigation*/

#menu-item{

	transition: all 0.5s ease-in-out;

}

.menu-item{

	background-color: #1a1a1a ;

	text-align: center;

	font-size: 16px;

	text-transform: uppercase;

}

.menu-item ul{

	padding-left: 0;

	margin-bottom: 0;

}

.menu-item ul a li{

	padding: 15px 0;

	list-style-type: none;

	color: #fff ;

	border-bottom:  1px solid rgba(255, 255, 255, 0.2);
	
	text-decoration: none;
}

.menu-item ul a:hover li{

	color: #51c2b9;

	text-decoration: none;

}

.hide-menu{

	margin-top: -377px;

}

.show-menu{

	margin-top: 0;

}

.dark-bar{

	background-color: #424242;

	background-image: none;

}

.navigation-bar{

	border-bottom: 1px solid rgba(255, 255, 255, 0.2);

	padding: 15px 0;

	font-size: 30px;

}

.navigation-bar a{

	color: #fff;

}

.menu{

	position: relative;

	display: inline-block;

}



.menu:after{

	position: absolute;

	left: -65px;

	top: 10px;

	color: #fff;

	font-size: 16px;

}

.m:after{

	content: 'MENU';
	
	animation: 1.0s ease-in-out;

}

.c:after{

	content: 'CLOSE';

}





/*Home page*/

.header{

	background-image: url(../images/1.jpg);

	height: 100vh;

	position: relative;

	min-height: 659px;

}



.intro-box{

	height: 100vh;

	display: table;

	text-align: center;

	width: 100%;

}

.intro{

	display: table-cell;

	vertical-align: middle;

}

.header h1{

	margin: 0;

}

.header h1, .header p{

	color: #fff;

	letter-spacing: 2px;

}

.header p{

	font-size: 32px;

	padding-top: 0;

	padding-bottom: 40px;

}

.header .ubutia-btn{

	border-color: #fff;

	color: #fff;

}

.header .ubutia-btn:hover{

	background-color: #fff;

	color: #424242;

}



.about{

	background-color: #f8f8f8;

}

.about img{

	margin: 30px auto;

	display: block;

}

.about span{

	font-family: 'Raleway';

	font-weight: 600;

}



.expert{

	background-color: #f8f8f8;

}

.expert p{

	line-height: 200%;

}

.expert .bg-img{

	background-image: url(../images/2.jpg);

	background-position-x: 85%;

	height: 100%;

}

.expert .bg-img:after{

	display: none;

}

.expert .section{

	padding-left: 30px;

	padding-right: 30px;

}




.ubutia-quote{

	background-image: url(../images/3.jpg);

	/*padding: 120px 0;*/

	color: #fff;

	font-style: italic;

}

.ubutia-quote p{

	font-size: 32px;

	color: #fff;

}

.ubutia-quote .quote{

	margin-bottom: 40px;

}

.ubutia-quote .author{

	font-size: 21px;

	margin-bottom: 40px;

}

.watch{

	background-image: url(../images/7.jpg);

	

background-color:#FFF;

	font-style: italic;

	font-size: 32px;

	color: #fff;

	padding: 150px 0;

}

.watch a{

	border: 2px solid #fff;

	margin-left: 10px;

	margin-right: 10px;

	line-height: 70px;

	border-radius: 100%;

	width: 70px;

	height: 70px;

	padding: 0;

	font-size: 21px;

	color: #fff;

}

.watch a:hover, .watch a:active, .watch a:focus{

	background-color: #fff;

	color: #424242;

}

.contact .ubutia-card{

	background-color: #f8f8f8;

	padding: 35px 0;

	transition: all 0.3s ease-in-out;

	margin-bottom: 45px;

}

.contact .ubutia-card:hover{

	box-shadow: 10px 10px 10px rgba(179, 169, 35, 0.692);
}

.contact .ubutia-card a:hover{
	color: rgb(5, 160, 160);
	font-size: 19px;
}

.contact .ubutia-card .ubutia-card-header{

	margin-bottom: 15px;

	font-size: 21px;

	color: #51c2b9;

}

.contact .ubutia-card .ubutia-card-content h3{

	letter-spacing: 2px;

	margin-bottom: 45px;

}

.contact .ubutia-card .ubutia-card-content h3:after{

	top: 40px;

}

.contact .ubutia-card .ubutia-card-content p{

	font-size: 18px;

}

.footer{

	background-color: #202020;

	text-align: center;

	padding: 60px 0;

}

.footer span{

	color: #ffd332;
}

.footer p{

	font-size: 21px;

	color: #fff;

	margin-bottom: 0;

}

.footer a{

	font-size: 18px;
	
	color: #ffde65;

	text-decoration: none;

}

.footer a:hover {

	color: #fff;

	background-color: #ac8b14;

	padding-right: 12px;

	padding-left: 12px;

	border-radius: 6px;

	text-align: center;
}
.footer b {
	
	font-style: normal;
}









/*animations*/

.ubutia-card .ubutia-card-header .card-icon:after{

	transition: all 0.3s ease-in-out;

}

.ubutia-card:hover .ubutia-card-header .card-icon:after{

	height: 120px;

	width: 120px;

	top: -1px;

	left: -1px;

}

.owl-theme .owl-dots .owl-dot span{

	background-color: #51c2b9;

	margin: 5px;

}

.owl-theme .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span{

	background-color: #51c2b9;

	height: 14px;

	width: 14px;

	margin: 3px;

}









@media (max-width: 767px){

	.ubutia-card{

		margin-bottom: 60px;

	}

}



.about-founder

{

	text-align:justify;

}



.about-founder img

{

	padding:0px;

	margin:0px;

}


.about-founder .tab

{

	margin-left:40px;

}



.polaroid img {

  border: 8px solid #fff;

  border-bottom: 40px solid #fff;

  -webkit-box-shadow: 3px 3px 3px #777;

     -moz-box-shadow: 3px 3px 3px #777;

          box-shadow: 3px 3px 3px #777;

}

 

.polaroid p {

  position: absolute;

  text-align: center;

  width: 100%;

  bottom: 0px;

  font: 400 18px/1 'Kaushan Script', cursive;

  color: #888;

}


/*Livechat*/

.openchat iframe {
	border : none;
	border-radius : 40px;
	position: fixed;
	bottom: 70px;
	right: 15px;
	z-index: 9;
	width : 40%;
	opacity : 0.9;
	
}
.chattext{
	
	position : fixed;
	text-decoration : none;
	color : #ffff;
	opacity: 0;
    transition: opacity 0.7s ;
	transition-timing-function: ease-in-out;
	font-weight : bold ;
	font-family : sans-serif;
	border : none;
	background-color : #CDA40A;
	border-radius: 10px;
	height : 20px ;
	width : 80px ;
	text-align : center;
	z-index: 9;
}

.chat-icon:hover + .chattext{
	display : block;
	bottom: 20px;
	right: 83px;
	opacity : 1;	
}

/* Mobile */

@media only screen and (max-width: 768px) {
.openchat iframe {
	width : 60%;
	height : 47%;
	right: 10px;
}
.chat-icon img{
	width : 42px ;
	height : 42px ;
}
.mail {

	right: 8px;
	bottom: 12px;
	position: fixed;
}
.chat-icon{

	right: 10px;
	bottom: 13px;
	position: fixed;
}

.mail img{
	
	width : 42px ;
	height : 43px ;
}

.Newrelease iframe{
	width : 100%;
	height : 220px;
}
.videocontainer iframe {
	height : 230px;
	padding-bottom : 18px;
}
.videocontainer .before{
	padding-bottom: 0px;
}
.videocontainer .last{
	margin-top: 0px;
	padding-bottom : 0px;
}
.splash h1{
	
	font: 41px 'SF';
	margin-right: 6px;	
}
.splash img {

	margin-top: 135px;
}
}

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

.mail {

		right: 7px;
		bottom: 11px;
	}
.mail img{
	
		width : 38px ;
		height : 39px ;
	}
.chat-icon{

		right: 8px;
		bottom: 11px;
	}
.chat-icon img{
		
		width : 38px ;
		height : 38px ;
	}		
}

/* Mobile-END */

.videocontainer .last{
	margin-top: 20px;
}

.Newrelease{
	padding : 20px 15px 0px 15px;
}

.chat-icon {
	border : none;
	position : fixed;
	bottom : 13px;
	right : 10px;
	z-index : 9;
	background : none;
	cursor : pointer;
}
.chat-icon:focus {
	outline : none;
}

.chat-icon img {
	width : 57px ;
	height : 57px ;
}


/* Mail */


.mail{
	border : none;
	position : fixed;
	bottom : 13px;
	right : 8px;
	z-index : 9;
	background : none;
	cursor : pointer;
	overflow: hidden;
}
.mail button{

	position: fixed;
}
.mail img{
	
	width : 57px ;
	height : 58px ;
	overflow: hidden;
	position: sticky;
}
.mail:focus{
	outline: none;
}
.mailtext{

	position : fixed;
	text-decoration : none;
	color : #ffff;
	opacity: 0;
    transition: opacity 0.7s ;
	transition-timing-function: ease-in-out;
	font-weight : bold ;
	font-family : sans-serif;
	border : none;
	background-color : #CDA40A;
	border-radius: 10px;
	height : 20px ;
	width : 80px ;
	text-align : center;
	z-index: 9;
}
.mail:hover + .mailtext{

	display : block;
	bottom: 18px;
	right: 77px;
	opacity : 1;
}

/* Mail-END */