/* Font
==============================*/
@import url(https://fonts.googleapis.com/earlyaccess/mplus1p.css);
@import url(https://fonts.googleapis.com/css?family=Text+Me+One.css);

.wf-mplus1p { font-family: "Mplus 1p"; }

body {	overflow-x: hidden;
	font-family: "Mplus 1p",sans-serif;}

.text-primary {
	color: #00CFEF !important;}

p {	line-height: 1.75;}

a {	color: #888888;
	text-decoration: none;}

a:hover, a:focus, a:active, a.active {
	color: #00CFEF;
	text-decoration: none;}

h1,h2,h3,h4,h5,h6{
	font-family: "Mplus 1p",sans-serif;
	font-weight: 400;
	line-height: 30px;
	margin:  0;}

h1 strong, h2 strong, h3 strong, h4 strong, h5 strong, h6 strong{
	font-weight: 800;
	line-height: 30px;
	margin:  0;}

/* Menu
==============================*/
#mainNav {
	background-color: #ffffff;
	padding:5px;
	border-top:#888888 solid 1px;
	font-family: "Text Me One";}

.navbar-left {
	float: left;
	color: #99EEFF;
	font-size: 26px;
	padding: 0px 0px 15px 15px;}

.navbar-right {
	float: right;
	color: #888888;
	font-size: 22px;
	padding: 4px 18px 15px 0px;}

.navbar-mail {
	float: right;
	padding: 9px 5px 15px 5px;}

@media (min-width: 768px) {
  .navbar-left {
	float: left;
	color: #99EEFF;
	font-size: 40px;
	padding: 0px 0px 0px 20px;}

  .navbar-right {
	float: right;
	color: #888888;
	font-size: 24px;
	padding: 10px 20px 0px 0px;}

  .navbar-mail {
	float: right;
	padding: 16px 0px 0px 5px;}}

/* Header
==============================*/
.bg-slider {
	width: 100vw;
	height: 100vh;
	background-position:center center;
	background-size: cover;
	display: flex;
	justify-content: center;}

.bg-slider_title {
	color: #99EEFF;
	font-size: 42px;
	text-align: center;
	position:absolute;
	top:16%;
	font-family: "Text Me One";}

@media (min-width: 768px) {
  .bg-slider_title {
	color: #99EEFF;
	font-size: 72px;
	text-align: center;
	position:absolute;
	top:20%;
	font-family: "Text Me One";}}

/* Section
==============================*/
section {padding: 0px;}

section h2.section-title {
	font-size: 42px;
	font-family: "Text Me One",sans-serif;
	margin-top: 50px;
	margin-bottom: 8px;}

section h3.section-caption {
	font-size: 12px;
	font-family: "Mplus 1p",sans-serif;
	text-transform: none;
	margin-bottom: 5px;
        padding: 0px 10px; 0px 10px}

section h4.section-caption {
	font-size: 8px;
	font-family: "Mplus 1p",sans-serif;
	text-transform: none;
	margin-bottom: 5px;
        padding: 0px 10px; 0px 10px}

@media (min-width: 768px) {
  section {padding: 0px;}

  section h2.section-title {
	font-size: 62px;
	font-family: "Text Me One",sans-serif;
	margin-top: 80px;
	margin-bottom: 15px;}

  section h3.section-caption {
	font-size: 16px;
	font-family: "Mplus 1p",sans-serif;
	text-transform: none;
	margin-bottom: 10px;
        padding: 0px 50px; 0px 50px}

  section h4.section-caption {
	font-size: 8px;
	font-family: "Mplus 1p",sans-serif;
	text-transform: none;
	margin-bottom: 5px;
        padding: 0px 10px; 0px 10px}}

/* About
==============================*/
#about{background-color: #ffffff;
	color: #888888;}

.about-title {
	margin-top: 30px;
	margin-bottom: 10px;}

#about h3 {font-size: 12px;
	font-family: "Mplus 1p",sans-serif;
	text-transform: none;
	margin-bottom: 5px;
        padding: 0px 10px; 0px 10px}

#about h4 {font-size: 22px;
	font-family: "Text Me One",sans-serif;
	margin-top: 20px;
	margin-bottom: -10px;}

#about h5 {font-size: 12px;
	font-family: "Mplus 1p",sans-serif;}

#about img {
	margin-bottom: 20px;
        padding: 0px 2px; 0px 0px}

@media (min-width: 768px) {
  .about-title {
	margin-top: 10px;
	margin-bottom: 8px;}

  #about h3 {font-size: 14px;
	font-family: "Mplus 1p",sans-serif;
	text-transform: none;
	margin-bottom: 5px;
        padding: 0px 30px; 0px 30px}

  #about h4 {font-size: 26px;
	font-family: "Text Me One",sans-serif;}

  #about h5 {font-size: 14px;
	font-family: "Mplus 1p",sans-serif;}}

/* Gallery
==============================*/
#gallery{background-color: #F1F1F1;
	color: #888888;}

.photo {
	margin: 0px;
	padding: 2px;}

.photo-full {
	display: block;
	position: relative;
	margin: 0 auto;}

.item {
	background: rgba(153, 238, 255, 0.9);
	position: absolute;
	width: 100%;
	height: 100%;
	opacity: 0;
	transition: all ease 0.5s;
	-webkit-transition: all ease 0.5s;
	-moz-transition: all ease 0.5s;}

.photo .photo-full .item:hover {opacity: 1;}

.onmouse h4{
	position: absolute;
	width: 100%;
	text-align: center;
	top: 42%;
	margin-top: -12px;
	color: #ffffff;
	font-family: "Mplus 1p",sans-serif;
	font-size: 60px;}

@media (min-width: 768px) {
  .photo {
	margin: 0px;
	padding: 5px;}

  .onmouse h4{
	position: absolute;
	width: 100%;
	text-align: center;
	top: 45%;
	margin-top: -12px;
	color: #ffffff;
	font-family: "Mplus 1p",sans-serif;
	font-size: 80px;}}

/* plan
==============================*/
#plan{background-color: #F1F1F1;
	color: #888888;}

#plan h4 {font-size: 16px;
	font-family: "Mplus 1p",sans-serif;
	margin-bottom: 16px;}

#plan h5 {font-size: 12px;
	font-family: "Mplus 1p",sans-serif;}

#plan img {
	width: 94%;
	margin-bottom: 50px;
        padding: 0px 2px; 0px 0px}

@media (min-width: 768px) {
  #plan h4 {font-size: 18px;
	font-family: "Mplus 1p",sans-serif;
	margin-bottom: 16px;}

  #plan h5 {font-size: 14px;
	font-family: "Mplus 1p",sans-serif;}

  #plan img {
	width: 60%;
	margin-bottom: 50px;
        padding: 0px 2px; 0px 0px}}

/* mail
==============================*/
#mail{background-color: #ffffff;
	color: #888888;}

#formWrap {
	width:100%;
	margin:0 auto;
	color:#555555;
	line-height:120%;
	font-size:90%;}

table.formTable{
	width:100%;
	margin:0 auto;
	border-collapse:collapse;}

table.formTable td,table.formTable th{
	border:1px solid #00CFEF;
	padding:10px;}

table.formTable th{
	width:120px;
	font-weight:normal;
	background:#99EEFF;
	text-align:left;}

@media (min-width: 768px) {
  #formWrap {
	width:700px;
	margin:0 auto;
	color:#555555;
	line-height:120%;
	font-size:90%;}

  table.formTable th{
	width:80px;
	font-weight:normal;
	background:#99EEFF;
	text-align:left;}}

/* footer
==============================*/
nav#footer{
	background: #F1F1F1;
	color: #888888;
	padding: 15px 0px 100px 0px;}