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

* { padding: 0; margin: 0; box-sizing: border-box }
body, html { height: 100%; font-family: 'Comfortaa', cursive; font-size: 1vw; padding: 0; margin: 0 }

h1 { font-size: 2em; margin: 2% 0 2% 2%; text-align: left; color: #ff4c00 }
h2 { font-size: 1.75em; margin: .5em 0; color: #607f02 }
h3 { font-size: 1.50em }
p { font-size: 1.25em; line-height: 25px; color: #424242 }
p.em125 { font-size: 1.25em }
p.greenlg { color: green; font-size: 3em }
p.boxorange { border: 2px solid orange; padding: 2% 1%; color: #9ac60f; font-size: 5vw }

a:link { color: white }
a:visited { color: white }
a:hover { color: white}
a:active { color: white }
a { text-decoration: none }


.email:visited { color: #ff4c00 }
.email:hover { color: #ff4c00 }
.email:active { color: #ff4c00 }
.email { color: #ff4c00 }

.orange { color: #ff4c00 }
.bgorange { background: #ff4v00 }
.green { color: #607f02 }
.bgpalegreen { background: #d7ffaf }
.red { color: red }
.bg666 { background: #666 }
.white { color: white }

.orange1 { background-color: #ff9933 }
.orange2 { background-color: #ccff33 }
.orange3 { background-color: #99ccff }
.orange4 { background-color: #ccff33 }
.orange5 { background-color: #ff9933 }


.table { display: table; width: 100% }
.table100w { display: table; width: 100%; border-collapse: separate; border-spacing: .5em }
.row { display: table-row }
.cell { display: table-cell; width: 100% }
.cellp15 { display: table-cell; width: 15%; border: .5em solid red }
.cellp20 { display: table-cell; width: 20%; height: 100%; vertical-align: top; text-align: center; border: .08em solid grey; border-radius: 1em; border-radius: 1em }
.cellp25 { display: table-cell; width: 25%; border: 1px solid blue }
.cellp33 { display: table-cell; width: 33.333333%; text-align: center }
.cellp40 { display: table-cell; width: 40% }
.cellp50 { display: table-cell; width: 50% }
.cellp60 { display: table-cell; width: 60% }
.cellp60 p { color: white }

/*16:9*/
.video-container { position: relative; padding-bottom: 56.25%; padding-top: 30px; height: 0; overflow: hidden } 
.video-container iframe, .video-container object, .video-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100% }

header { display: table; width: 100% }
header .cellp40 { display: table-cell; width: 40%; padding: .5em 0; text-align: center; vertical-align: middle }
header .cellp60 { display: table-cell; width: 60%; padding: .5em 4em .5em 0; text-align: right; vertical-align: middle }
header .logocell { display: table-cell; width: 40%; text-align: center; vertical-align: middle; padding: 2% 0 2% 2% }
header img.logo { width: 50%; height: auto }
header img.social { width: 8%; height: auto }
header img.social:first-child { margin-right: 2em }
header .navbox { display: table-cell; width: 60%; padding: 0 5% 0 0; vertical-align: middle }
header .navbox a:link { color: black }
header .navbox a:visited { color: #666 }
header .navbox a:hover { color: #999 }
header .navbox a:active { color: #999 }

nav { display: table; width: 100%; white-space: nowrap }
nav ul { display: table-row }
nav li { display: table-cell; text-align: center; padding: 0 1em }
nav li a { text-decoration: none; font-size: 1.25em }

nav.pages { display: table; white-space: nowrap; margin: auto; margin-top: 2em }
nav.pages ul { display: table-row }
nav.pages li { display: table-cell; text-align: center; padding: .5em 0; border-right: 1px solid #333 }
nav.pages li a { text-decoration: none; font-size: 1em }
nav.pages a:link { color: black }
nav.pages a:visited { color: #666 }
nav.pages a:hover { color: #999 }
nav.pages a:active { color: #999 }

section { width: 100%; overflow: hidden }

section.graphic { width: 100%; overflow: hidden }
section.graphic img { width: 100%; height: auto }

section.home { width: 100%; overflow: hidden; padding: 2em 5em }
.cell60 h2 { color: #ff4c00 }
section.home ul { list-style-type: none }
section.home li { text-transform: uppercase; font-size: 1.75em }
.readmore { display: inline-block; overflow: hidden; margin: 1em 0; padding: .25em 1em; border-radius: 2em; background: #8dc73f }
.readmore p { font-size: 1.5em }

.container { width: 40%; height: 100%; display: table; margin: auto }
.circle { border-radius: 50%; display: table-cell; width: 100%; position: relative; padding-bottom: 100%; border: .40em dashed chartreuse }
.abscircle { position: absolute; top: 0; right: 0; bottom: 0; left: 0; text-align: center }
.tablecircle { display: table; width: 100%; height: 100% }
.cellcircle { display: table-cell; width: 100%; height: 100%; text-align: center; vertical-align: middle }

section.content { width: 100%; overflow: hidden; padding: 3% 20%; background: white }
section.content h1 { font-size: 2em; padding: 2% 0 2% 0; text-align: left; color: #ff4c00 }
section.content h2 { font-size: 1.75em; margin: .5em 0; color: #607f02 }
section.content h3 { font-size: 1.50em }
section.content p { font-size: 1.25em; line-height: 1.5em; margin-left: 2em; text-align: justify; color: black }

section.prices { width: 100%; text-align: center; overflow: hidden }
section.prices ul li { list-style: none; font-size: .85em; color: #333; line-height: 2em }
section.prices ul li.white { color: white }
section.prices h2 { font-size: 1.25em; text-align: center; padding-bottom: .5em; color: #333 }
section.prices h3 { font-size: .75em; text-align: center; color: #333 }

.actionbutton { display: inline-block; overflow: hidden; margin: 1em auto; padding: .25em 1em; border-radius: 2em; text-align: center; background: #8dc73f }
.actionbuttonwrap { width: 100%; text-align: center }
.actionbuttonwrap p { font-size: 1em; color: white; text-align: center }
.head { margin-bottom: 2em; padding: 1em 0; border-top-left-radius: 1em; border-top-right-radius: 1em }
.head p { font-size: 1.25em; color: red }

footer { width: 100%; display: table; padding: 2% 0; background: #ff4c00 }
footer .cell33 { width: 33.333333%; display: table-cell; vertical-align: top; text-align: center }
footer .leftalign { display: inline-block; text-align: left }
footer li { font-size: 1em; color: white }
footer h2 { font-size: 1.5em; margin-bottom: 0 0 .5em 0; padding: 0; color: black }
footer ul { }
footer a { text-decoration: none }
footer ul li { list-style: none }

.privacy { width: 100%; padding: .5% 5% .5% 0; background: #333 }
.privacy p { text-align: right; font-size: .75em; color: white }

.table100 { display: table; width: 100% }
.cell40 { width: 40%; display: table-cell; text-align: center; vertical-align: middle; padding: 2% 0 }
.cell60 { width: 60%; display: table-cell; text-align: left; vertical-align: middle }
.cell60 a { text-decoration: none }
.cell60 ul li { font-size: 1.40em; line-height: 1.5em; list-style: none; text-decoration: none }
.cell60 li:before { content:"·"; font-size: 4em; vertical-align: middle; padding-right: 2% }

hr { height: 6px; width: 60%; margin: 2% auto; background: url(images/hr-line.png) repeat-x 0 0; border: 0 }

@media (max-width: 600px) {
	h1 { font-size: 4em; padding: 1em 0; text-align: center }
	h2 { font-size: 3.5em; margin: .5em 0 }
	section.home { padding: 2em 0 }
	section.home ul { }
	section.home li { text-transform: uppercase; font-size: 2.5em }
	section.home p { font-size: 3em; text-align: justify; line-height: 1em }
	section.content p { font-size: 2em; line-height: 1em; margin-left: 2em; text-align: justify; color: black } }
	
@media (max-width: 600px) {
	nav.pages li { padding: .5em 0 }
	nav.pages li a { font-size: 1.5em } }
	
@media (max-width: 600px) {	
	section.content { padding: 3% 10% }
	section.content h1 { font-size: 3.5em }
	section.content h2 { font-size: 3em }
	section.content h3 { font-size: 1.50em }
	section.content p { font-size: 3em; line-height: 1.5em; margin-left: 2em; text-align: justify; color: black } }

@media (max-width: 600px) {
	header { padding: 6em 0 }
	header .cellp40 { display: block; width: 100%; padding: 1% 0; margin: 0 0 }
	header .cellp60 { display: block; width: 100%; font-size: 2em; text-align: center; padding: 1% 0 }
	header .logocell { display: block; width: 100%; text-align: center; padding: 2% 0 }
	header .logo img { width: 70% }
	header img.social:first-child { margin-right: 0 }
	header .navbox { display: block; width: 100%; padding: 0; margin-top: 3em }
	nav { display: table; width: 100%; white-space: nowrap; margin: auto }
	nav ul { display: table-row }
	nav li { display: table-cell; text-align: center; padding: 0 2em }
	nav li a { font-size: 2.5em } }

@media (max-width: 600px) {
	section.prices ul li { font-size: 3em; line-height: 2em }
	section.prices ul li.white { display: none }
	section.prices h2 { font-size: 4em; padding-bottom: .05em }
	section.prices h3 { font-size: 3em }
	.head { margin-bottom: 2em; padding: 3em 0 }
	.head p { font-size: 4em }
	.cellspace { border-spacing: 0 }
	.cellp20 { display: block; width: 90%; margin: auto; margin-bottom: 2em }
	.actionbutton {}
	.actionbutton p { font-size: 3em } }

@media (max-width: 600px) {
	footer { }
	footer .cell33 { width: 100%; display: block; padding: 3em 0 }
	footer .leftalign { display: inline-block; text-align: center }
	footer li { font-size: 4em }
	footer h2 { font-size: 5em }
	footer ul { }
	footer a { text-decoration: none }
	footer ul li { list-style: none } }