/*Copyright (c) Wed May 27 2015 Mark Ireland

This CSS file currently is a legal posesion of MarkAmations - Unless otherwise specified, use of this scrip in sites other than those listed is unlawful.
//LISTED SITES\\
www.markamations.com/jandc
//\\//\\ //\\//\\
If you wish to have a site designed please visit www.markamations.com and contact us for more information.
~Hand Crafted With Love - By MarkAmations.*/

@import url(http://fonts.googleapis.com/css?family=Roboto:400,100,100italic,300,300italic,400italic,500,500italic);
@import url(http://fonts.googleapis.com/css?family=Open+Sans:400,300,400italic,300italic,600,600italic,700,800);

body
{
    margin: 0;
    top: 0;
    left: 0;
    background: #242424 none repeat scroll 0% 0%;
    overflow-x: hidden;
    bottom: 0;
}

hr 
{
  width: 100%;
  height: 2px;
  background: white;
  margin-top: 1em;
  margin-bottom: 1em;
  border: 0px;
  opacity: 0.5; 
}

h1
{
    font-family: Roboto;
    color: white;
    font-weight: 300;
    font-size: 35px;
}

h2
{
    font-family: Roboto;
    color: white;
    font-weight: 300;
    font-size: 30px;
}

h3
{
    font-family: Roboto;
    color: white;
    font-weight: 300;
    font-size: 20px;
}

h4
{
    font-family: Open Sans;
    color: white;
    font-weight: 300;
    font-size: 18px
}


.head
{
    width: 100%;
    background:#8EB822 none repeat scroll 0% 0%; 
    height: 350;
}

.logo
{
    margin-top: 25px;
}

.nav-b
{
    background-color: inherit;
    border: 0px none;
    color: white;
    font-family: Open Sans !important;
    font-size: 20px;
    -o-transition:0.5s;
    transition: 0.5s;
      border-bottom: 1px solid rgba(192, 192, 192, 0);
  /* ^- the important bit. RGB 192,192,192 is the same as #C0C0C0*/
  
  -webkit-transition: border 500ms ease;
  -moz-transition: border 500ms ease;
  -ms-transition: border 500ms ease;
  -o-transition: border 500ms ease;
  transition: border 500ms ease; 
}

.nav-b:hover
{
/*    color: #242424;*/
    cursor: pointer; cursor: hand;
     border-bottom: 1px solid rgba(236, 240, 241,1.0);
}

.svg-top
{
    fill:#242424;
}

.svg-mid
{
    fill:;
}

section
{
    width: 90%;
    margin: 0 auto 20px;
    max-width: 1300px;
}

.center
{
    text-align: center;
}

.cfont
{
    font-family: Open Sans;
    font-weight: 300:
}

.green
{
    background: #8EB822 none repeat scroll 0% 0%;
    width: 100%;
}

.dark
{
    background:#242424 none repeat scroll 0% 0%;
}

.img-cov
{
    background-image: url(../images/boxscan.jpg);
    background-repeat: no-repeat;
    background-position: center; 
	background-attachment: scroll;
	background-size: 100%;
}

.full
{
    width: 100%;
}

.darkt
{
    color:#242424;
}

.row
{
    height: 200px;
}

.icon
{
    float: right;
    width: 33.33%;
    display: inline;
}

.text
{
    width: 250;
}

.FAQdetail
{
    margin-top: 100px;
}

.input
{
    background-color: #3E3E3E;
    border:1px solid #212122;
    height: 25px;
    width: 200px;
    color: white;
    font-family: Open Sans;
}

form  
{ 
/*    display: table;*/
}

label 
{ 
    display: table-cell;
    color: white;
    font-family: Open Sans;
    color: #AAA9A9;
    font-weight: 300;
}

.ipt 
{ 
    display: table-cell; 
    height: 25px;
    border: 1px solid #212122;
    background-color: #3E3E3E;
    color: white;
    font-family: Open Sans;
    width: 90%;
}

.form-holder
{
    width: 200px;
}

.form-holder2
{

}

textarea
{
    font-size: 15;
}

.row2
{
    float: left;
    width: 50%;
    display: inline;
}

.scroll-top-wrapper 
{
    position: fixed;
	opacity: 0;
	visibility: hidden;
	overflow: hidden;
	text-align: center;
	z-index: 99999999;
/*    background-color: #777777;*/
	color: #eeeeee;
	width: 44px;
	height: 44px;
	line-height: 48px;
	right: 25px;
    border-radius: 4px;
	bottom: 30px;
	-webkit-transition: all 0.5s ease-in-out;
	-moz-transition: all 0.5s ease-in-out;
	-ms-transition: all 0.5s ease-in-out;
	-o-transition: all 0.5s ease-in-out;
	transition: all 0.5s ease-in-out;
}

.scroll-top-wrapper:hover 
{
	background-color: #AAA9A9;
}

.scroll-top-wrapper.show 
{
    visibility:visible;
    cursor:pointer;
	opacity: 1.0;
}

.scroll-top-wrapper i.fa 
{
	line-height: inherit;
}

#map
{
    width: 97%; 
    height: 350px;
}

.bottom
{
    margin-top: 175px;
}

/*FAQS*/
.faq_question {
    margin-top: 10px;
    margin: 0px;
    padding: 0px 0px 2px 0px;
    display: inline-block;
    cursor: pointer;
    font-weight: bold;
}
 
.faq_answer_container {
    height: 0px;
    overflow: hidden;
    padding: 0px;
}

.faq_answer
{
    height:500px;
    max-height: 500px
}

a
{
    background-color: inherit;
    border: 0px none;
    color: white;
    text-decoration: none;
    font-family: Open Sans !important;
    font-weight: 400;
    font-size: 20px;
    -o-transition:0.5s;
    transition: 0.5s;
      border-bottom: 1px solid rgba(192, 192, 192, 0);
  /* ^- the important bit. RGB 192,192,192 is the same as #C0C0C0*/
  
  -webkit-transition: border 500ms ease;
  -moz-transition: border 500ms ease;
  -ms-transition: border 500ms ease;
  -o-transition: border 500ms ease;
  transition: border 500ms ease; 
}

a:hover
{
/*    color: #242424;*/
    cursor: pointer; cursor: hand;
     border-bottom: 1px solid rgba(236, 240, 241,1.0);
}

a:visited 
{
    color: white;
}

.fhov
{
    color:white;
}

.fhov:hover
{
    color:#8EB822;
}

.lower
{
    margin-top: 75px;
}

.greent
{
    color: #8EB822;
}

@media (max-width: 830px) 
{
    .icon
    {
        width: 33.33%;
        float: none;
        margin-top: 25px;
    }
    
    .row
    {
        height: 600px;
    }
    
    .FAQdetail
    {
        margin-top: 250px;
    }
}

@media (min-width: 1036px)
{
    #map-holder
    {
        display: none;
    }
}

@media (min-width: 983px)
{
    .faq_answer
    {
        height:500px;
    }
}

.sph
{
	width:200px;
	height:200px;
	border-radius:100%;
	background-color:#8EB822;
	transition:0.5s;
	display:inline-block;
	padding:5px;
    margin-right: 50px;
    margin-left: 50px;
}

.sph:hover
{
	width:300px;
	height:370px;
	border-radius:10%;
	margin-bottom:10px;
}

.sph:hover>.text
{

	color:#242424;
	text-align:center;
	padding-top:18px;
	padding-bottom:10px;
	font-family:Roboto;
	font-weight:300;
	-webkit-transition:0.5s;
    font-size: 15px;
	
}

.sph:hover > .text {color:white;}

.sph:hover > .cImage
{
    margin-top: 1px;
}


.text
{
    font-size: 0px;
	color:#242424;
	text-align:center;
	padding-top:18px;
	padding-bottom:10px;
	font-family:Roboto;
	font-weight:300;
	-webkit-transition:0.5s;
}

.cImage
{
    width: 150px;
}