@charset "UTF-8";
/* CSS Document */

/*@font-face {
font-family: 'lato';
src:url('../font/Lato-Reg.ttf')
src: url('../font/Lato-Reg.eot?#iefix') format('embedded-opentype'),
url('../font/Lato-Reg.woff') format('woff'),
url('../font/Lato-Reg.ttf') format('truetype'),
url('../font/Lato-Reg.svg#lato') format('svg');
font-weight: normal;
font-style: normal;

}

*/

@font-face {
    font-family: 'lato';
    src: url('../font/Lato-Reg.eot');
    src: url('../font/Lato-Reg.eot?#iefix') format('embedded-opentype'),
         url('../font/Lato-Reg.woff') format('woff'),
         url('../font/Lato-Reg.ttf') format('truetype'),
         url('../font/Lato-Reg.svg#lato') format('svg');
    font-weight: normal;
    font-style: normal;

}

/*@font-face {
	font-family:"lato";
	src:url(../font/Lato-Reg.ttf);
	
}*/

body {
  background-color: #f2f2f2;
    font-family: "lato";
    font-weight: 300;
    font-size: 16px;
    color: #333;
    -webkit-font-smoothing: antialiased;
    -webkit-overflow-scrolling: touch;
    margin-top: 70px;
}


h1{
    font-family: "lato";
    font-weight: 300;
    color: #333;
	text-align:center;
	line-height:40px;
	font-size:40px;
}

h2, h3, h4, h5, h6  {
	 font-family: "lato";
	 color:#333;
	 text-align:left;
	 font-weight:300;
	 font-size:30px;
	 line-height:40px;
}

p {
    line-height: 24px;
    margin-bottom: 0px;
	 color: #333;
	 font-weight:300;
	 text-align:justify;
}

/* Links */
a {
    color: #f85c37;
    word-wrap: break-word;

    -webkit-transition: color 0.1s ease-in, background 0.1s ease-in;
    -moz-transition: color 0.1s ease-in, background 0.1s ease-in;
    -ms-transition: color 0.1s ease-in, background 0.1s ease-in;
    -o-transition: color 0.1s ease-in, background 0.1s ease-in;
    transition: color 0.1s ease-in, background 0.1s ease-in;
}

a:hover,
a:focus {
    color:#c1ac51;
    text-decoration: none;
    outline: 0;
}

a:before,
a:after {
    -webkit-transition: color 0.1s ease-in, background 0.1s ease-in;
    -moz-transition: color 0.1s ease-in, background 0.1s ease-in;
    -ms-transition: color 0.1s ease-in, background 0.1s ease-in;
    -o-transition: color 0.1s ease-in, background 0.1s ease-in;
    transition: color 0.1s ease-in, background 0.1s ease-in;
}


#wrapper {
	margin: auto;
	padding:0px;
	height:auto;
	width:100%;
}

#liondoll_banner img{
		max-width:1900px;
		width:100%;
	
}
.rainbow-line {
	margin-top:5px;position:fixed; z-index:99999;
	
}

#balloons-gallery .container{
	
	width:1170px;
	margin:0 auto;	
}


#gallery .container {
	
	 width:940px;
	margin:0 auto;	
}

.promote {
background:#E3E3E3;
padding-bottom:50px;
padding-top:20px;
}
.promote h1 {
	font-family:'lato';	
	line-height:50px;
	
}

#promo {
	
background:#000;	
}
.banner_span1 {
			position:relative;
			padding-top:180px;
			background:url(../images/lion_poster3.jpg) 50% no-repeat;
			width: 100%;
			height:750px;
			margin-bottom:0px;
			background-size: 1450px Auto;	
			
		}
		
			
		.banner-container{ 
		position:absolute; 
		margin-top: 870px;
		left:50%;
		padding-left:20px;
		padding-right:20px;
		padding-bottom:10px;
		margin-left:-350px;
		border-radius:8px;		  
		}
		
.play { 
		position:absolute; 
		margin-top: 180px;
		left:50%;
		padding-left:20px;
		padding-right:20px;
		padding-bottom:10px;
		margin-left:-70px;
		border-radius:8px;		  
		}
		
		
.banner-title {
	
   margin-top:50px;
    color:#FFFFFF;
   left: 0; 
   width: 100%; 
   font-size:40px;
}


section {
display: block;
float: left;
width: 100%;
background:#f8f8f8;
}

#services {
padding-top:50px; padding-bottom:50px; background:#dfc247;	
	
}

#services .container {
width:80%; margin:0 auto;max-width:1170px;	
}


.content{ margin: 0 auto; width: 960px; }

 .quotes_container { width: 800px; margin: 0 auto; }

#about, #syariah-aid, #law-aid, .faraid-content, .dolls{
background:#f8f8f8;	
	padding:50px 0px;
}

.doll-container {
	
	
	width:80%;
		height:400px;
margin:0 auto;
}

.small-doll-span{
	width:35%;
	float:left;

	
}



.small-doll-span img{
	max-width:452px;
	width:100%;	
	margin:-20px auto 0;
	margin-left:-15px;
}

.small-doll-content {
	width:30%;
	float:left;
	padding-left:10px;
	padding-top:80px;
}

.faraid-subpages {
	
	padding-top:120px; padding-bottom:10px;

	width:100%;
	
}

.faraid-container{
background:#e8e8e8;	
	padding:50px 0px;
	border-bottom:1px #CCCCCC solid;
	
}

 .faraid-content{
	padding:50px 0px 90px;
	float:right;
}
.syariah-row {
	display:block;
	width:95%;
	margin:0 auto;
	min-height:30px;
}

.law-row {
	display:block;
	width:95%;
	margin:0 auto;
	
}

.span1 {
	float:left;
	margin-left:70px;
	margin-bottom:20px;
	width:25%;
	height:200px;
	text-align:center;
	
}

.span2 {
	float:left;
	margin-left:70px;
	margin-bottom:20px;
	width:25%;
	height:200px;
	text-align:center;
	
}


.span1 img {
	max-width:80px;
	width:100px;	
}

.span2 img {
	max-width:80px;
	width:100px;	
}

/*CONTACT FORM*/

#contact {
	background:#e9e5e5;
	float:left;
	width:100%;
	padding:50px 0;
	height:auto;
}


#contact .container {
	width:80%; margin:0 auto;
	max-width:1170px;
}


	.contact-info {
	float:left;
	width:30%;
	margin-right:20px;	
		
	}
	
	#enquiry-form {
	float:left;
	width:50%;
}

.enquiry-container {
		text-align:left;
		margin-bottom:10px;
  
}


#gmap_canvas {
	
height:450px;width:100%;margin:0 auto;
}



.map {
	
	overflow:hidden;height:500px;width:60%;
}

.form-container-subpages {
	width:90%;
	padding-top:10px;
	padding-bottom:20px;
	 
}

.form-container {
	width:90%;
	margin:0 auto;
	padding-top:20px;
}

.left-container {
	width:50%;
	float:left;
	line-height:24px;
	
}

.right-container {
	width:50%;
	float:right;
	line-height:24px;
	
}

/*FOOTER*/

.mainFooter {
	bottom:0;
		width: 100%;
		float: left;
		background-color: #f8f8f8;	
		color: #333;
		font-size: 12px;	
		text-decoration:none;
	

		
	}
	
	
	.footer {
		width:98%;
		max-width:1170px;
		margin: 0 auto;
		font-family:helveticalight;
		text-decoration:none;
		
	}
	
	
	.span6 {
		float:left;
		color:#333; 
		font-size:14px; 
		text-decoration:none; 
		font-weight:normal;
		text-align:left;
		font-family:Arial, Helvetica, sans-serif; 
		line-height:20px;
		}
		
		.fb {
			margin-top:15px;
			float:right;
			
		}
	
	
	.preorder_btn {
		
		padding:20px 50px 20px 50px;
		background:#A12916;
		color:#FFFFFF;
	}
	
	

/*footer {
	
background:#333333;	
	padding:0px;
	bottom:0;
	width:100%;
	
}

.footer-text {
	color:#ffffff;
	margin-top:0px;
	font-size:14px;
	font-weight:normal;
	text-align:center;
}*/


/*FIXED BACKGROUND IMAGE*/


.column2-thumb h2 {
	font-size:16px;
	line-height:20px;	
	padding-top:15px;
	text-align:left;
	
}

.column2-thumb img {
	float:left;
    max-width:260px;
	width:100%;
	
}

.column2-thumb {
	width:260px;
    height:220px;
  margin-right: 20px;
   position: relative;
   text-align: left;
   display: inline-block;
   float:left;
	
}

.column1-thumb h2 {
	font-size:16px;
	line-height:20px;	
	padding-top:15px;
	text-align:left;
	
}

.column1-thumb img {
	float:left;
    max-width:260px;
	width:100%;
	
}

.column1-thumb {
	width:260px;
    height:220px;
  margin: 15px;
   position: relative;
   text-align: left;
   display: inline-block;
   float:left; 
}

.column3-thumb img {
	float:left;
    max-width:260px;
	width:100%;
	
}

.column3-thumb {
	width:260px;
    height:440px;
  margin: 15px;
   position: relative;
   text-align: left;
   display: inline-block;
   float:left; 
}

.column3-thumb h2 {
	font-size:16px;
	line-height:20px;	
	padding-top:15px;
	text-align:left;
	
}

.visual{
background-attachment:fixed !important;
width:100%;
height:1200px;
background:url('../images/building2.png') no-repeat 50%;
-webkit-background-size:cover;
-moz-background-size:cover;
-o-background-size:cover;
background-size:cover

}

.visual h1{
	position:absolute;
	width:100%;
	top:75%;
	left:0%;
	margin:-48px 0 0 0;
	font:normal 40px "Theinhardlt",Helvetica,Arial,sans-serif
	;color:#fff;text-transform:uppercase;
	text-align:center;
	filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
	opacity:0;-webkit-transition:all 800ms cubic-bezier(0.190, 1.000, 0.220, 1.000);
	-webkit-transition-delay:500ms;-moz-transition:all 800ms cubic-bezier(0.190, 1.000, 0.220, 1.000) 500ms;
	-o-transition:all 800ms cubic-bezier(0.190, 1.000, 0.220, 1.000) 500ms;
	transition:all 800ms cubic-bezier(0.190, 1.000, 0.220, 1.000) 500ms;}

.visual .visual-content{
	
	position:relative;
	width:100%;height:100%;
	-webkit-transform:rotate3d(0, 0, 0, 0);
	-moz-transform:rotate3d(0, 0, 0, 0);
	-ms-transform:rotate3d(0, 0, 0, 0);
	-o-transform:rotate3d(0, 0, 0, 0);
	transform:rotate3d(0, 0, 0, 0);
	
	}


.visual .cover{
	
	
	}

.cover {
	height:100%;
	width:100%;
	top:0;
	left:0;
	position:absolute;
	
}

.order {
	padding:50px 0; background:#fff;
	
}

.order .container {
	
	width:90%; margin:0 auto;
}

.order h1{
	font-size:40px;
	
}


.visual.inspiration{background:url('../images/scale.png') no-repeat center;-webkit-background-size:cover;-moz-background-size:cover;-o-background-size:cover;background-size:cover}

.visual.clients{background:url('../images/building2.png') no-repeat 50%;
-webkit-background-size:cover;
-moz-background-size:cover;
-o-background-size:cover;
background-size:cover
}



.visual.what-differentiates-us{background:url(../images/building2.png) no-repeat center;-webkit-background-size:cover;-moz-background-size:cover;-o-background-size:cover;background-size:cover}.visual.get-in-touch{background:url('../images/visuals/get-in-touch.png?1396526294') no-repeat center;-webkit-background-size:cover;-moz-background-size:cover;-o-background-size:cover;background-size:cover}.visual.inview h1{filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=100);opacity:1}.visual.inview .cover{filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=100);opacity:1}


.syariah-btn {
	
			line-height:60px;
  font-family: 'mynormalfont';
  color: #ed9a42;
  font-size: 16px;
  background:transparent;
  padding: 10px 20px 10px 20px;
  text-decoration: none;
  letter-spacing:normal;
}

.syariah-btn:hover {
	
line-height:60px;
  font-family:'mynormalfont';
  color:#FA2;
  font-size: 16px;
  padding: 10px 20px 10px 20px;
  text-decoration:underline;
	  letter-spacing:normal;
}


.law-btn {
	
			line-height:60px;
  font-family:'mynormalfont';
  color: #088b9f;
  font-size: 16px;
  background:transparent;
  padding: 10px 20px 10px 20px;
  text-decoration: none;
	 letter-spacing:normal;
}

.law-btn:hover {
	
			line-height:60px;
  font-family: 'mynormalfont';
  color: #53C1E5;
  font-size: 16px;
  padding: 10px 20px 10px 20px;
  text-decoration:underline;
	 letter-spacing:normal;
}

.small-space-grey {
	background-color:#D0D7E0;
	height:5px;
	width:63px;
	margin:0 auto;
	
	
}

#talents .container {
	width:90%;
	margin:0 auto;
	max-width:1170px;
}

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


#ipad-logo {
	
display:none;	
}

.displays {
	display:block;
	
}
.sub-content {
	background:#F7F7F7;
	border-bottom:1px solid #ccc;
	width:100%;	
	margin:0 auto;
	padding-top:10px;
	position:fixed;
	z-index:2;
}

.sub-menu ul {
	
list-style-type: none;
background:transparent;
height: 125px;
width:1210px;
margin: auto;
}

.sub-menu ul li {
float: left;
}

.sub-menu  ul a {
padding-right:29px;
padding-left:29px;
padding-top:20px;
padding-bottom:15px;
display: block;
line-height: 18px;
text-align:center;
text-decoration: none;
font-family:'mynormalfont';
font-size: 14px;
color:#666;
letter-spacing:0.01em;
}

.sub-active:visited {
	color:#088b9f; 
	border-bottom:1px solid #088b9f;	
}

.sub-active {
	color:#088b9f; 
	border-bottom:1px solid #088b9f;	
}

.sub-menu img {
	
margin:0 auto; width:50px; padding-bottom:10px;	
}

.sub-active-syariah:visited {
	
	color:#ed9a42; 
	border-bottom:1px solid #ed9a42;
}

.sub-active-syariah {
	color:#ed9a42; 
	border-bottom:1px solid #ed9a42;	
}

.sub-active {
	color:#088b9f;
	
}


#subpage-container {
	
	background:#f8f8f8;
	padding:80px 0px;
	height:768px;
	
}


.my-submenu {
	width:20%;
	position:absolute;
	
}


.sub-span1 {
	
	width:80%; 
	margin:0 auto; 
	background:#e9e9e9; 
	padding:20px; 
	margin-top:160px;
	border:1px #CCCCCC solid;
}

#ipad-logo2 {
	display:none;
}

.details-container {
	width:1124px;
	margin:0 auto;	
	
}

.details-content {
	float:left;
	position:relative;
	margin-left:20px;
	background:#e3e3e3;
	padding:20px;
	width:290px;
	border:5px solid #FFF;
	height:400px;
}

#merchandise .container {
	width:600px; margin:0 auto;
}

#merchandise .container .column1-thumb p{
	line-height:24px;
}

.rainbow-line2 {
	
	margin-top:88px;position:fixed; z-index:99999;

}

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

#balloons-gallery .container{
	
	width:82.1%;
	margin:0 auto;	
}

.column2-thumb {
	width:260px;
    height:200px;
  	margin:10px;
   position: relative;
   text-align: left;
   display: inline-block;
   float:left;
	
}

.rainbow-line {
	margin-top:8px;
	
}

/**.rainbow-line2 {
	
	margin-top:80px;
} **/

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


#talents .container {
	width:82.1%;
	margin:0 auto;
}

.column1-thumb {
	width:260px;
    height:220px;
  margin:10px;
   position: relative;
   text-align: left;
   display: inline-block;
   float:left;
	
}

.column1-thumb img {
	
 max-width:260px;
 width:100%;
}

#gallery .container {
	
	 width:82.1%;
	 margin:0 auto;
}

.doll-container {
	width:90%;
	height:340px;	
}

.small-doll-content {
	padding-top:40px;
	padding-left:20px;
}

.details-content {
	width:220px;
	height:450px;
}

.contact-info {
	float:left;
	width:40%;
	margin-right:20px;	
		
	}
	
	#enquiry-form {
	float:left;
	width:50%;
}

	
	.footer {
		width:90%;
		max-width:1170px;
		margin: 0 auto;
		font-family:helveticalight;
		text-decoration:none;
		
	}
	
	
	
}

@media (min-width: 768px) and (max-width: 979px) {
	
	.footer {
		width:90%;
		max-width:1170px;
		margin: 0 auto;
		font-family:helveticalight;
		text-decoration:none;
		
	}
	
	#talents .container {
	width:86%;
	margin:0 auto;
}

.column1-thumb {
	width:200px;
    height:180px;
  margin:10px;
   position: relative;
   text-align: left;
   display: inline-block;
   float:left;
	
}

.column1-thumb img {
	
max-width:260px;
width:100%;
	
}

		
	.column2-thumb {
	width:200px;
    height:150px;
  margin: 10px;
   position: relative;
   text-align: left;
   display: inline-block;
   float:left;
	
}

#balloons-gallery .container{
	
	width:86%;
	margin:0 auto;	
}

.rainbow-line2 {
	
	margin-top:80px;
}

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

#merchandise .container {
	
	width:460px;
	margin:0 auto;
}


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


.details-content {
	width:100px;
	height:450px;
}



.small-doll-content  h2 {
	font-size:24px;
	
}

.doll-container {
	width:90%;
	height:340px;	
}

.small-doll-content {
	padding-top:10px;
	padding-left:10px;
}

.details-container {
	width:700px;
	margin:0 auto;	
	
}


.details-content {
	width:160px;
	height:530px;
}

#contact .container {
	width:85%; margin:0 auto;
	max-width:1170px;
}
	.contact-info {
	float:left;
	width:45%;
	margin-right:20px;	
		
	}
	
	#enquiry-form {
	float:left;
	width:50%;
}

}

@media (max-width: 767px) {
	
	.footer {
		width:89%;
		max-width:1170px;
		margin: 0 auto;
		margin-bottom:10px;
		font-family:helveticalight;
		text-decoration:none;
		
	}
	.span6 {
		float:none;
		color:#333; 
		font-size:14px; 
		text-decoration:none; 
		font-weight:normal;
		text-align:center;
		font-family:Arial, Helvetica, sans-serif; 
		line-height:20px;
		margin-bottom:5px;
		}
	
		.fb {
			margin-top:-10px;
			margin-bottom:10px;
			float:none;
			text-align:center;
			margin: 0 auto;
			width:50px;
		}
	
	
	.column2-thumb {
	width:250px;
    height:220px;
	margin-bottom:-60px;
  margin-right: 20px;
   position: relative;
   margin:0 auto;
   text-align: left;
   display:block;
   float:none;
	
}

#balloons-gallery .container{
	
	width:80%;
	margin:0 auto;	
}

	#about {
	padding:0px 0px;
}
	
	.order h1{
	font-size:36px;
}

.order {
	padding:50px 0; background:#fff;
	
}

.order .container {
	
	width:83%; margin:0 auto;
}

.rainbow-line {
	margin-top:8px;
	z-index:999;
}

#merchandise .container {
	
	width:80%;
	margin:0 auto;
}

.column1-thumb {
	width:270px;
    height:auto;
	margin-bottom:5px;
  margin-right: 10px;
   position: relative;
   text-align: left;
   float:none;
	
}

.column1-thumb img {
	
max-width:270px;
width:100%;
	
}

#gallery .container {
	
	 width:80%;
	margin:0 auto;
}

.container {
	
	 width:70%;
	margin:0 auto;
	
}
.mapmap {

}
.mapmap .container {
	width:90%;
	margin:0 auto;	
}

	#gmap_canvas {
	float:none;
	height:400px;width:100%;
	
}

.map {
	
	overflow:hidden;height:500px;width:100%;
}
	
	.contact-info {
	float:none;
	width:90%;	
	margin:0 auto;
	text-align:center;	
	}
	
	
#contact {
	background:#e9e5e5;
	height:1050px;
	padding-top:50px;
}

.doll-container {
	
	
	width:90%;
		height:800px;
margin:0 auto;
}

.small-doll-span{
	width:80%;
	float:none;
	padding-top:20px;
	margin:0 auto;
}



.small-doll-span img{
	max-width:452px;
	width:100%;	
	margin:-20px auto 0;
	margin-left:-15px;
}

.small-doll-content {
	width:90%;
	float:none;
	margin:0 auto;
}



.details-container {
	width:90%;
	margin:0 auto;	
	
}

.details-content {
	float:none;
	position:relative;
	margin:0 auto;
	margin-bottom:20px;
	background:#e3e3e3;
	padding:20px;
	width:80%;
	border:5px solid #FFF;
	height:500px;
}

.promote h2 {
	
	font-size:20px;
}

#enquiry-form {
		padding-top:0px;
	float:none;
	width:100%;
	margin:0 auto;
}

#contact p {
 text-align:center;	
	
}
}