/* CSS Document */

/* default */
img{border:0;}
h1,h2,h3,h4,h5,h6{ font-weight:normal;}
h1,h2,h3,h4,h5,h6,p,ul,ol,li,dl,dd,dt { padding:0; margin:0;}
ul,ol {}
a { text-decoration:none;}
.hidden{ text-indent:-999em; overflow:hidden;}
hr.hide-line{ padding:0; margin:0; display:none;}

/*clearings*/
.clear{ clear:both;}
.clearfix:after {content:"."; display:block; height:0; clear:both;visibility:hidden;font-size: 0;}
.clearfix {display:block;}

/* Clearfix */
.clrfix:before,
.clrfix:after {
    content: " ";
    display: table;
}
.clrfix:after {
    clear: both;
}
.clrfix {
    *zoom: 1;
}

/*floats*/
.fl {float:left;}
.fr {float:right;}

/*display*/
.dB {display: block;}

/*buttons*/
.appoint a {width: 100%; max-width: 207px; background: linear-gradient(#F56411, #DC430A); border-radius: 5px; transition: all .5s ease-out;
font-weight: 700; font-size: 16px; color: #FFF; padding: 20px 15px;}
.appoint a:hover {background: linear-gradient(#DC430A, #F56411); color: #50AE14;}

/*fonts*/
h1 {font-size: 50px;font-weight: 100;color:#50AE14;}
h2 {font-family: 'Montserrat', sans-serif; font-weight: 900;}
h4 {font-weight: 700;}
p {font-weight: 400; font-size: 18px; line-height: 30px;}

/* Body */
body{margin: 0 auto;text-align: center;font-family: 'Roboto', sans-serif;}
.row {width: 100%; max-width: 1200px; margin: 0 auto;}

/*fonts*/
h1 {font-size: 50px;font-weight: 100;color:#50AE14;}
h2 {font-family: 'Montserrat', sans-serif; font-weight: 900;}
h4 {font-weight: 700;}
p {font-weight: 400; font-size: 18px; line-height: 30px; margin-bottom: 20px;}
a {color: #FFF;}

/*contact form*/
.ctc-form {margin: 0 auto;text-align: center;}
.ctc-form input[type="text"],.ctc-form textarea {font-family:'Roboto', sans-serif;font-size: 16px;color:#000;height:45px;display: block;width: 100%;border:1px solid #ddd;border-radius: 3px;padding: 5px 10px;box-sizing: border-box;margin: 0 auto 8px}
.ctc-form textarea {height: 120px;padding-top:10px;}
.ctc-form .btn {width: 100%; max-width: 245px; height: 64px; line-height: 64px; background: #DF480B; border: 1px solid #DF480C; font-family: 'Montserrat', sans-serif; font-weight: 900; font-size: 30px; color: #FFF; cursor: pointer; transition: all 2s ease-out; text-transform: uppercase; margin: 20px 0 40px;}
.ctc-form .btn:hover {background: #50AE14;}
#inner .ctc-form .btn {height: 40px; line-height: 40px; margin: 10px auto;}
#inner .ctc-form label {}
.ctc-form .recap {display: inline-block;}

/*header*/
#header {}
#header .hd-top {background: #50AE14; box-sizing: border-box; padding: 15px 0; width: 100%; color: #FFF;}
#header .hd-top .row div {display: inline-block; vertical-align: top;}
#header .hd-social {width: 50%; text-align: left; padding: 10px 0;}
#header .hd-social h4 {font-weight: 400; font-size: 13px; letter-spacing: .2em; line-height: 120%; display: inline-block; margin-right: 20px;}
#header .hd-social ul {padding: 0; margin: 0; list-style: none; display: inline-block;}
#header .hd-social ul li {display: inline-block; width: 30px; margin: auto; text-align: center; transition: all .5s ease-out; color: #FFF;}
#header .hd-social ul li:hover, #header .hd-social ul li:hover > a {transform: rotateY(360deg); color: #E6500D;}
#header .hd-tel {text-align: left; width: 50%;}
#header .hd-tel p::before {content: url(../images/common/hd-tel.png); position: absolute; margin: 0px 0 0 -58px; color: #FFF;}
#header .hd-tel p {font-weight: 700; font-size: 24px; line-height: 120%; display: inline-block; width: 49%; vertical-align: top; margin: 0;}
#header .hd-tel p span {font-weight: 400; font-size: 11px; display: block; line-height: 110%;}
#header .hd-btm {box-sizing: border-box; padding-top: 10px;}
#header .hd-btm .row div {display: inline-block; vertical-align: top; width: 20%; float: left; text-align: left;}
#header .hd-logo {padding: 5px 0;}
#header .hd-nav {width: 58% !important;}
#header .hd-buttons {width: 22% !important; float: right;}

#header nav a#pull {display: none}
#header nav ul {margin: 0;padding: 0}
#header nav ul li {display: inline-block;vertical-align: middle; height: 109px; line-height: 109px; border-bottom: 10px solid transparent; transition: all 1s ease-out;}
#header nav ul li a {font-weight: 700; font-size: 16px; line-height: 120%; padding: 0 27px; color: #888888;}
#header nav ul li.active-menu, #header nav ul li:hover {color: #50AE14; border-bottom: 10px solid #E8530D;}
#header .appoint {margin: 23px 0 0 5px; width: 100% !important; text-align: center !important;}
#header .appoint a {padding: 14px 15px;}
#header .hd-banner {position: relative; width: 100%; height: 100%; max-height: 780px;}
#header .bn-con img {width: 100%; max-width: 1600px;}
#header .bn-text {position: absolute; top: 0; bottom: 0; right: 0; left: 0; padding: 340px 0 0; color: #FFF; text-align: center;}
#header .bn-text h4 {font-size: 18px; color: #A9D359; line-height: 36px;}
#header .bn-text h2 {font-size: 44px; padding: 30px 0 80px; line-height: 120%;}
#header .bn-text a {width: 100%; max-width: 600px; height: 100%; max-height: 80px; font-family: 'Montserrat', sans-serif; font-weight: 900; font-size: 24px; padding: 20px 120px; background: linear-gradient(#F56411, #DC430A); transition: all .5s ease-out;}
#header .bn-text a:hover {background: linear-gradient(#DC430A, #F56411); color: #50AE14;}
#header .bn-text img {margin: 80px auto 50px;}
#header .apb {margin: 20px 0 0 4px; text-align: center !important;}
#header .apb p {font-size: 15px; line-height: 23px;}
#header .apb a {padding: 14px 19px; background: none; color: #000; text-align: center !important; padding: 0 !important;}

/*---------------
# sticky header #
----------------*/
 .sticky {position: fixed;top: 0;left:0;width: 100%;background: #eee;margin: 0;padding: 5px 0 0; z-index: 9999;}
 .sticky, .sticky * {transition: 0.5s ease;}

/*banner*/
#banner{width: 100%;}
#banner .caption h4 {font-size: 18px; color: #A9D359; line-height: 36px;}
#banner .caption h2 {font-size: 44px; padding: 30px 0 80px; line-height: 120%; color: #FFF;}
#banner .caption a {width: 100%; max-width: 600px; height: 100%; max-height: 80px; font-family: 'Montserrat', sans-serif; font-weight: 900; font-size: 24px; padding: 20px 120px; background: linear-gradient(#F56411, #DC430A); transition: all .5s ease-out;}
#banner .caption a:hover {background: linear-gradient(#DC430A, #F56411); color: #50AE14;}
#banner .caption {position: absolute; width: 100%; bottom: 10%; z-index: 9;}
#banner .caption .row {max-width: 1236px;}

/* main */
#main { width:100%; margin:0 auto; padding:0;}

/* content */
#content{}
#content-top {box-sizing: border-box; padding: 70px 0; background: url(../images/content/cn-top-bg.jpg) top center no-repeat; width: 100%; background-size: 100%;}
#content-top .row {position: relative;}
#content-top .pointer {margin-bottom: 80px;}
#content-top .cn-top-l {display: inline-block; width: 100%; max-width: 694px; color: #FFF; text-align: left;}
#content-top .cn-top-l section:nth-of-type(1) {position: relative; max-width: 694px;}
#content-top .cn-top-l section:nth-of-type(1) img {width: 100%;}
#content-top .cn-top-l section h2 {font-size: 30px; background: rgba(244,100,17,.7); padding: 40px 65px 40px 50px; box-sizing: border-box; position: absolute; bottom: 4px;}
#content-top .cn-top-l section:nth-of-type(2) {box-sizing: border-box; padding: 50px 88px 50px 30px; text-align: left;}
#content-top .cn-top-l section h3 {color: #50AE14; font-weight: 900; font-size: 24px; line-height: 36px; margin-bottom: 20px;}
#content-top .cn-top-l section p {color: #111111;}
#content-top .cn-top-l section p span {color: #E0480B; font-weight: 700;}
#content-top .cn-top-l section h4 {font-size: 24px; color: #50AE14; line-height: 30px; margin-bottom: 20px;}
#content-top .cn-top-r {width: 100%; max-width: 565px; position: absolute; right: 0; background: #FFF; margin-top: 5%;}
#content-top .qform {box-shadow: 0px 0px 10px #AAA;}
#content-top .cn-top-r h2 {background: linear-gradient(#A8D458, #52AF15); padding: 30px 0; color: #FFF;}
#content-top .cn-top-r form {margin: 30px auto 0; width: 90%;}
#content-top .cn-top-r label {margin: 5px 0; text-align: left; font-weight: 400; font-size: 14px; color: #78909C; float: left;}
#content-top .required {color: #D31112; margin-left: 10px;}
.g-recaptcha div {margin: 20px auto;}
#content-top .cn-top-r input[type="text"], #content .cn-top-r textarea {background: #EEEEEE; border-radius: 0; border: 1px solid #CCC; width: 100%; background: #EEE; border: 1px solid #CCC;}
#content-top .card {margin: 20px 0;}
#content-top .card p {margin: 20px 0; text-align: center; color: #78909C;}
#content-top .card img {width: 100%; max-width: 566px; margin-bottom: 30px;}
#content-top .cn-top-b {box-sizing: border-box; padding: 30px 0; border-top: 1px solid #D6D6D6;}
#content-top .cn-top-b p {font-weight: 700; font-size: 18px; color: #A9D359; letter-spacing: .2em; line-height: 36px;}
#content-top .cn-top-r .appoint a {width: 100%; max-width: 300px; margin-top: 30px;}

/*-------------------
# services section #
--------------------*/
#content .svc {background: url(../images/content/svc-bg.jpg) top center; min-height: 1080px; box-sizing: border-box; padding: 30px 0; background-size: 100%;}
#content .svc-ptr {margin-bottom: 50px;}
#content .svc h3 {font-weight: 700; font-size: 24px; color: #FFF; letter-spacing: .2em; line-height: 36px;}
#content .svc h2 {font-size: 64px; color: #50AE14; line-height: 120%;}
#content .svc .svc-p-t {width: 100%; max-width: 960px; color: #FFF; font-size: 24px; margin: 30px auto;}
#content .svc p span {font-weight: 700;}
#content .svc h4 {font-size: 18px; color: #A9D359; letter-spacing: .2em; line-height: 36px; margin-bottom: 20px}
#content .svc dl {width: 100%; max-width: 569px; border-radius: 10px; min-height: 166px; background: #FFF; box-sizing: border-box; display: inline-block;}
#content .svc dl:nth-of-type(1), #content .svc dl:nth-of-type(3) {margin: 0px 40px 40px 0; vertical-align: top;}
#content .svc dt, #content .svc dd {display: inline-block; float: left;}
#content .svc dt {max-width: 151px;}
#content .svc dt img {width: 100%; max-width: 151px; border-radius: 10px 0 0 10px; display: block;}
#content .svc dl dd h2 {font-size: 44px; width: 280px; text-align: left; padding: 25px 0;}
#content .svc dl:nth-of-type(3) dd {padding: 32px 0;}
#content .svc-bot section {width: 49%; display: inline-block; box-sizing: border-box; padding: 20px 0; text-align: center; vertical-align: top;}
#content .svc-bot section h2 {font-size: 30px ; color: #F46411;}
#content .svc-bot section p {font-size: 18px; margin: 20px auto; color: #FFF; width: 100%; max-width: 570px;}

#content .green-svc {box-sizing: border-box; padding: 50px 0; background: #FFF;}
#content .green-svc h2 {color: #50AE14; font-size: 64px; line-height: 120%;}
#content .green-svc p {font-size: 24px; color: #000; padding: 30px 0; width: 100%; max-width: 750px; margin: auto;}
#content .green-svc ul {padding: 0; margin: 0; color: #DE470B; display: inline-block; vertical-align: top; text-align: left; float: left; margin-right: 53px;}
#content .green-svc ul:last-child {margin-right: 0;}
#content .green-svc ul li span {font-weight: 300; font-size: 18px; color: #111111; line-height: 44px;}

/*-------------------
# review section #
--------------------*/
#content .rvw {box-sizing: border-box; padding: 30px 0 50px; background: linear-gradient(#F5F3EC 70%, #FFF);}
#content .rvw h2 {font-size: 48px; color: #50AE14; line-height: 120%;}
#content .rvw p {color: #5D4037; width: 100%; max-width: 670px; margin: 20px auto 40px;}
#content .rvw h4 {font-size: 36px; color: #E1490B; line-height: 36px;}
#content .rvw-comment {font-weight: 300; font-style: italic; color: #000; line-height: 36px; max-width: 750px !important;}
#content .rvw-name {font-weight: 500; font-style: italic; color: #000 !important; line-height: 36px; margin: 20px auto !important;}
#content .rvw-links img { width: 100%; max-width: 100px; height: 100%; max-height: 50px; margin: 20px 10px 0;}

/*------------------------
# content-bottom section #
------------------------*/
#content .gmap iframe {width: 100%;}
#content .contact {box-sizing: border-box; padding: 50px 0; background: #FFF;}
#content .contact h2 {font-size: 64px; color: #50AD13; line-height: 120%; margin-bottom: 20px;}
#content .contact .row div {display: inline-block; vertical-align: top; float: left;/* width: 25%;*/ text-align: left;}
#content .ft-logo {width: 30%; margin-right: 80px;}
#content .contact h5 {font-weight: 400; font-size: 13px; color: #858383; letter-spacing: .2em; line-height: 120%; margin-bottom: 20px;}
#content .contact p {font-weight: 400; font-size: 15px; color: #858383; line-height: 30px;}
#content .contact p span {font-weight: 700; font-size: 24px; color: #50AE14; line-height: 5px; display: block;}
#content .ft-loc {width: 18% !important; margin-right: 80px}
#content .ft-loc p:nth-of-type(1)::before {content: url(../images/common/loc.png); position: absolute; margin: 9px 0 0 -60px;}
#content .ft-loc p:nth-of-type(2)::before {content: url(../images/common/email.png); position: absolute; margin: -7px 0 0 -60px;}
#content .ft-loc p a {color: #858383;}
#content .ft-tel p {font-weight: 400; font-size: 11px; color: #000; padding: 15px 0 0;}
#content .ft-tel p::before {content: url(../images/common/hd-tel.png); position: absolute; margin: -8px 0 0 -60px;}
#content .ft-tel p a {color: #50AE14;}
#content .ft-social ul {list-style: none; padding: 0; margin-left: -10px}
#content .ft-social ul li {width: 30px; display: inline-block; transition: all .5s ease-out; text-align: center;}
#content .ft-social ul li a {color: #E1490B;}
#content .ft-social ul li:hover {transform: rotateY(360deg);}

/* contact */
.contactBox, .contactForm {display: inline-block; vertical-align: top; width: 49%;}
.contactBox {margin:0 auto; padding:105px 0px; /*border: 1px #D71015 solid;*/ color:#000; box-sizing: border-box;}
.contactBox p { padding:0 10px 0 !important; font-size: 14px; text-align: left; margin: 10px auto 20px !important;}
.contactBox-right p span {display: block; font-size: 12px;}
.contactBox label {}
.contactBox p input {width: 100%;}
.contactBox a { color:#50AE14 !important; font-size: 18px;}
.contactBox strong {color: #E24B0B; font-size: 18px;}
.contactBox-left, .contactBox-right {width:50%; margin:0; padding:0; }
.contactBox-left { float:left;}
.contactBox-right { float:right;}

.contactForm {margin:10px auto 50px; padding:30px; color:#000; box-sizing: border-box;}
.contactForm label { display:block; margin:0; padding:5px 0 5px 0px; font-size:14px; line-height:120%; text-align: left; font-weight: 600; color: #E24B0B}
.contactForm input[type=text] { display:block; width:450px; min-height:25px; margin:0 auto; padding:0 10px; font-size:14px; line-height:120%; border:0; box-sizing: border-box; width: 100%; border: 1px solid #888;}
.contactForm input[type=submit] { display:block; width:100px; margin:0 auto; padding:0 0 2px 0; text-align:center; font-size:14px; line-height:120%; letter-spacing: .2em; font-weight: 700; font-size: 16px;}
.contactForm textarea { display:block; width:450px; margin:0 auto; padding:10px 0px; font-size:14px; line-height:120%; box-sizing: border-box; width: 100%; border: 1px solid #888;}
.Form_Full2 {display: inline-block; vertical-align: top; width: 48%; margin-right: 10px;}
.nm {margin-right: 0;}
.text-area {width: 99%; margin-right: 0;}

/* aside */
aside{ float:right; width:280px; min-height:444px; margin:0; padding:0; background:#C63;}

/*footer*/
#footer {}
#footer .ft-top {box-sizing: border-box; box-shadow: 0px 0px 10px #AAA; min-height: 119px; width: 100%; vertical-align: top;}
#footer .ft-nav, #footer .appoint {display: inline-block;}
#footer nav ul {margin: 0;padding: 0}
#footer nav ul li {display: inline-block;vertical-align: middle; height: 109px; line-height: 109px; color: #888888; border-bottom: 10px solid transparent; transition: all 1s ease-out; text-align: center;}
#footer nav ul li a {font-weight: 700; font-size: 16px; line-height: 120%; color: #888888; margin: 0 32px;}
#footer nav ul li.active-menu, #footer nav ul li:hover {color: #50AE14; border-bottom: 10px solid #E8530D;}
#footer .appoint {margin: 10px 0 0 5px;}
#footer .copy-con {margin: 20px 0;}
#footer .copy-con p, #footer .copy-con p a {font-weight: 300; font-size: 14px; color: #455A64;}
#footer .silver img {display: inline-block;vertical-align: middle;max-width: 50px}

#inner #content {padding: 40px 0;}
#inner #content h2 {padding-bottom: 30px; font-size: 50px; color: #50AE14;}
#inner #content p {margin: 10px auto;}
#inner #header {border-bottom: 5px solid #50AE14;}


/*-------------------
# services          #
--------------------*/
#inner .wwt-box {border: 1px solid #AAA; box-shadow: 0px 0px 10px #AAA; margin: 20px auto; box-sizing: border-box; width: 70%;}
#inner .wwt-box div {width: 100%;}
#inner .wwt-box .title {background: linear-gradient(#F56411, #DC430A);}
#inner .wwt-box div h3 {padding: 15px 0; color: #FFF; font-weight: 900;}
#inner .wwt-box .wwt-1 li:nth-of-type(even),#inner .wwt-box .wwt-x li:nth-of-type(even) {background: rgba(245,100,17, .3);}
#inner .wwt-box .wwt-1 li:nth-of-type(odd),#inner .wwt-box .wwt-x li:nth-of-type(odd) {background: rgba(245,100,17, .1);}
#inner .wwt-box .wwt-1 ul {padding: 0; list-style: none; text-align: left; display: inline-block; vertical-align: top; width: 49.7%;}
#inner .wwt-box .wwt-1 ul li {text-indent: 20px; height: 40px; line-height: 40px;}
#inner .wwt-box .wwt-x {margin: 30px auto 0; border: 1px solid #CCC;}
#inner .wwt-box .wwt-x:last-child {padding-bottom: 30px}
#inner .wwt-box .wwt-x ul {color: #DC430A; padding: 0; display: inline-block; width: 33%; vertical-align: top; text-align: left; list-style: none;}
#inner .wwt-box .wwt-x ul li {text-indent: 20px;}
#inner .wwt-box .wwt-x ul li span {height: 40px; line-height: 40px; color: #000; margin-left: 10px;}

/*-------------------
# review page       #
--------------------*/
#inner .rvw-box {box-sizing: border-box; padding: 20px; border: 2px solid #50AE14; border-radius: 10px; text-align: left; margin: 30px auto; width: 80%; box-shadow: 0px 2px 10px #000;}
#inner .rvw-box h3 {color: #000000; font-weight: 600; font-size: 24px; margin-bottom: 15px;}
#inner .rvw-box ul {padding: 0; margin: 0; list-style: none; display: inline-block; vertical-align: middle;}
#inner .rvw-box ul li {display: inline-block; float: left; margin-left: 3px; width: 30px;}
#inner .rvw-box ul li:nth-of-type(1) {transition: transform 1s ease-out;}
#inner .rvw-box ul li:nth-of-type(2) {transition: transform 1.5s ease-out;}
#inner .rvw-box ul li:nth-of-type(3) {transition: transform 2s ease-out;}
#inner .rvw-box ul li:nth-of-type(4) {transition: transform 2.5s ease-out;}
#inner .rvw-box ul li:nth-of-type(5) {transition: transform 3s ease-out;}
#inner .rvw-box:hover > ul li {transform: rotateY(360deg);}
#inner .rvw-box .rvw-time {display: inline-block; vertical-align: middle; padding-left: 20px;}
#inner .rvw-box hr {height: 5px; width: 100%; max-width: 300px; border: none; background: #50AE14; margin: 0; margin-bottom: 30px;}


#content .ft-logo img:hover, .hd-logo img:hover, #content .rvw-links img:hover {animation: shake 1s;}
@keyframes shake {
	0% { transform: translate(1px, 1px) rotate(0deg); }
  10% { transform: translate(-1px, -2px) rotate(-2deg); }
  20% { transform: translate(-3px, 0px) rotate(0deg); }
  30% { transform: translate(3px, 2px) rotate(2deg); }
  40% { transform: translate(3px, 2px) rotate(0deg); }
  50% { transform: translate(3px, 2px) rotate(2deg); }
  60% { transform: translate(3px, 2px) rotate(0deg); }
}