@font-face {
	font-family: 'DINProLight';
	src: url('./DINProLight.eot');
	src: local('DINProLight'), url('./DINProLight.woff') format('woff'), url('./DINProLight.ttf') format('truetype');
}

body
{
	font-family: 'Lato', sans-serif;	
	letter-spacing: 2px;
	font-size: 150%;
	color: #3a3a3c;
}

nav
{
	color: white;
	background-color: #29AFA8;
	height: 80px;
}

nav li p a
{
	color: white;
	margin-top: 15px;
	margin-left: 10px;
}

#navright
{
	background-color: #29AFA8;
}

.navbar-brand img
{
	float: left;
}

.navbar-brand p
{
	float: left;
	color: white;
	margin: 15px 20px;
	font-weight: bold;
}

.cleardiv
{
	clear: left;
}

.btn-login
{
	border-radius: 8px;
	border: 2px solid white;
}

.btn-nav:hover
{
	border: 2px solid white;
	background-color: white;
	color: #29AFA8;
}

.sliderUtama
{
	width: 100%;
	height: 40vw;
	background-color: #ccc;
	
    max-height: 1200px;	

}

.servicefacilitiesbox
{
	margin-top: 50px;
}

.serviceli li, .fasilitasli li
{
	list-style: none;
	margin-top: 15px;
}

.cbox
{
	background-color: #29AFA8;
	color: white;
	width: 100%;
}

.cboxtext
{
	margin-top: 50px;
	margin-bottom: 50px;
}

.cboxtext span
{
	color: red;
}

.btn-send
{
	border-radius: 8px;
	border: 2px solid white;
	color: white;
	margin-top: 20px;
	margin-bottom: 50px;
}

.textgold
{

}

.input1 {
    background: transparent !important;
    border: none !important;
    border-bottom: 1px solid #656565 !important;
    border-radius: 0px !important;
    box-shadow: none !important;
    color: #fff !important;
    font-weight: 300 !important;
    height: 50px !important;
    font-size: 14px !important;
    line-height: 21px !important;
    margin-bottom: 10px !important;
    padding: 10px 0 !important;
    width: 100%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-transition: all .8s linear;
    -moz-transition: all .8s linear;
    -ms-transition: all .8s linear;
    -o-transition: all .8s linear;
    transition: all .8s linear;
}

.input2 {
    background: transparent !important;
    border: none !important;
    border-bottom: 1px solid white !important;
    border-radius: 0px !important;
    box-shadow: none !important;
    color: white !important;
    font-weight: 300 !important;
    height: 50px !important;
    font-size: 14px !important;
    line-height: 21px !important;
    margin-bottom: 10px !important;
    padding: 10px 0 !important;
    width: 100%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-transition: all .8s linear;
    -moz-transition: all .8s linear;
    -ms-transition: all .8s linear;
    -o-transition: all .8s linear;
    transition: all .8s linear;
}

.input2::placeholder {
  color: white;
}

.parallax {
	height: 500px;
	width: 100%;
	background-image: url(../img/background.jpg);
    background-repeat: repeat-y;
    background-repeat-x: no-repeat;
    background-repeat-y: repeat;
    background-size: cover;
    background-position: top center;
}

.paral2 {
	height: 400px;
	width: 100%;
	background-image: url(../img/box2.jpg);
    background-repeat: repeat-y;
    background-repeat-x: no-repeat;
    background-repeat-y: repeat;
    background-size: cover;
    background-position: top center;
}

.gmap {
	height: 500px;
	width: 100%;
    
}

.btn-read
{
	border-radius: 8px;
	border: 2px solid #29AFA8;
	color: #29AFA8;
	margin-top: 50px;
	margin-bottom: 50px;
}

.btn-read:hover
{
	border-radius: 8px;
	border: 2px solid #29AFA8;
	color: white;
	background-color: #29AFA8;
}

.gestext
{
	margin-top: 70px;
	margin-bottom: 100px;
}

.infordbox
{
	background-color: #b09a51;
	color: white; 
}

.infordtext
{
	margin-top: 25px;
}

.registertext p span
{
	color: #b09a51;
	font-weight: bold;
}

.btn-black
{
	border-radius: 8px;
	border: 2px solid #3a3a3c;
	color: #3a3a3c;
	margin-top: 20px;
	margin-bottom: 50px;
}

.btn-black:hover
{
	border-radius: 8px;
	border: 2px solid #3a3a3c;
	color: white;
	background-color: #3a3a3c;
}

.proline
{

	margin-bottom: 20px;
}

.proline p
{
	margin-top: 20px;
}

.proline:hover
{
	font-weight: bold;
	border: dotted 1px #ccc;
	border-radius: 10px;
}

.item {
    position: relative;
    display: inline-block;
    height: 300px;
}

.tooltiptext {
    visibility: hidden;
    width: 350px;
    background-color: #29AFA8;
    color: #fff;
    text-align: center;
    padding: 5px 0;
    border-radius: 6px;
 
    /* Position the tooltip text - see examples below! */
    position: absolute;
    z-index: 9999999;
}

/* Show the tooltip text when you mouse over the tooltip container */
.item:hover .tooltiptext {
    visibility: visible;
}

.tooltip .tooltiptext {
    width: 300px;
    top: 100%;
    left: 50%; 
    margin-left: -150px; /* Use half of the width (120/2 = 60), to center the tooltip */
}

.gmap
{
	background-color: grey;
}

.ns
{
	height: 100px;
}

.btn-nav:focus
{
	color: white;
	border: 1px solid white;
}

.affix {
  top: 0;
  width: 100%;
  z-index: 9999 !important;
}

.affix + .container-fluid {
  padding-top: 70px;
}

.spaceplease
{
	margin-top: 80px;
}

.navbar
{
	border-radius: 0px;
}

.lineabout
{
	height: 280px;
	border-left: 1px solid white;
}

.textheader
{
	font-family: 'DINProLight', sans-serif;
}

.visionbox
{
	
	margin-top: 70px;
	margin-bottom: 70px;
}

.contactbox
{
	margin-top: 70px;
	margin-bottom: 70px;
}

.contactbox a
{
	text-decoration: none;
	color: white;
}

.logocontact
{
	margin-top: 30px;
}

.vision
{
	
	font-size: 30px;
}

.pointtext
{
	margin-bottom: 20px;
}

.logo
{
	border-radius: 3px;
}

@media (max-width: 410px) and (min-width: 300px) 
{
	.textheader, .lineabout
	{
		visibility: hidden;
		font-size: 1px;
	}

	.lineabout
	{
		width: 1px;
		height: 1px;
	}
}