
/*=========================================================================
 Layout Box Style
========================================================================= */

.layout-box { background: none repeat scroll 0 0 rgba(255, 255, 255, 0.3); border:1px solid #e8e8e8; border-radius: 3px 3px 3px 3px; margin-bottom: 20px; padding: 5px; text-align: center; color: #666; -webkit-transition:all .3s ease;
-moz-transition:all .3s ease;
-o-transition: all .3s ease;
-ms-transition:all .3s ease;
transition:all .3s ease;
}

.layout-box:hover { background: none repeat scroll 0 0 #D73604; border:1px solid #B71610; color: #fff; }

/*=========================================================================
 Separator
========================================================================= */

.separator:before { background: none repeat scroll 0 0 #F7F7F7; bottom: 0; content: ""; height: 5px; left: 0; position: absolute; width: 100%; -webkit-box-shadow: 0 1px 2px #DDDDDD inset; -moz-box-shadow: 0 1px 2px #DDDDDD inset; box-shadow: 0 1px 2px #DDDDDD inset; -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; behavior: url(css/PIE.html); }

.separator { margin-bottom: 30px; padding-bottom: 30px; position: relative; }

.separator-sidebar:before { border-bottom: 1px dashed #ccc; bottom: 0; content: ""; height: 10px; left: 0; position: absolute; width: 100%; }

.separator-sidebar { margin-bottom: 30px; padding-bottom: 30px; position: relative; }

.phone-separator { display: none; }

/*=========================================================================
 Notificition
========================================================================= */
.notify { display: inline-block; position: relative; margin: 30px 10px 30px 10px; width: 940px; text-align: center; }

.notify-left-text { float: left; margin-left: 10px; width: 772px; }

.tagline .notify-left-text h1 { margin-bottom: 3px; line-height: 32px; }

.tagline .notify-left-text p { color: #777; }

.notify-button { display: inline-block; float: right; margin: 0 10px 0 0; }

.notify .icon-nf { background: none repeat scroll 0 0 #DDDDDD; left: 25px; position: absolute; top: 20px; box-shadow: 0 0 10px #DDDDDD; -webkit-box-shadow: 0 0 10px #DDDDDD; -moz-box-shadow: 0 0 10px #DDDDDD; behavior: url(css/PIE.html); }

.notify p { margin-bottom: 0; }

.notify h2 { color: #4C3E37; display: block; font-family: 'Open Sans', Arial, Tahoma, sans-serif; font-size: 25px; font-weight: 400; line-height: 31px; margin-bottom: 6px; text-transform: uppercase; }

.notify h2 .sub-heading { float: right; color: #aaa; display: block; font-size: 22px; font-family: 'Open Sans', Arial, Tahoma, sans-serif; font-weight: 300; padding-top: 6px; text-shadow: 1px 1px 0 #FFFFFF; text-transform: lowercase; }

.notify-2 { display: inline-block; position: relative; margin: 20px 10px 20px 10px; width: 940px; text-align: center; }

.notify-2 .icon-nf { background: none repeat scroll 0 0 #DDDDDD; left: 25px; position: absolute; top: 20px; box-shadow: 0 0 10px #DDDDDD; -webkit-box-shadow: 0 0 10px #DDDDDD; -moz-box-shadow: 0 0 10px #DDDDDD; behavior: url(css/PIE.html); }

.notify-2 .tagline h1 { color: #fff; }

.notify-2 p { background: none repeat scroll 0 0 #EF1F27; color: #FFFFFF; display: inline-block; margin-bottom: 0; padding: 0 10px; }

.notify-2 a { color: #EF1F27; }

.notify-2 a:hover { color: #999; }

.notify-2 h2 { color: #000; display: block; font-family: 'Open Sans', Arial, Tahoma, sans-serif; font-size: 25px; font-weight: 400; line-height: 31px; margin-bottom: 6px; text-transform: uppercase; }

.notify-2 h2 .sub-heading { float: right; color: #aaa; display: block; font-size: 22px; font-family: 'Open Sans', Arial, Tahoma, sans-serif; font-weight: 300; padding-top: 6px; text-shadow: 1px 1px 0 #FFFFFF; text-transform: lowercase; }

.notify-wrapper em { color: #777777; font-size: 14px; line-height: 51px; margin: 0 5px; }

.notify-wrapper { display: inline-block; margin: 0; }

/*=========================================================================
 Breadcrumbs
========================================================================= */

.breadcrumbs { overflow: hidden; position: relative; }

.breadcrumbs span.bread-home a { background-image: url("../img/home-icon.html"), url("../img/breads.html"); background-position: left 20px, right center; background-repeat: no-repeat; color: transparent; display: inline-block; margin: 0 30px 0 0; padding: 2px 52px 0 0; text-indent: -9999px; text-shadow: none; }

.breadcrumbs span.bread-home a:hover { background-position: left -48px, right center; }

.breadcrumbs span.bread-home { text-indent: -9999px; }

.breadcrumbs a { background: url("../img/breads.html") no-repeat scroll right 0 transparent; color: #777; float: left; font-size: 100%; height: auto; margin: 0 30px 1px 0; padding: 0 30px 0 0; text-decoration: none; }

.breadcrumbs a:hover { color: #000; text-shadow: 0 1px 1px rgba(255, 255, 255, 0.3); }

.breadcrumbs a:hover { opacity: 1; text-decoration: none; }

.breadcrumbs p { color: #777; display: inline; font-family: 'Open Sans', Arial; font-size: 12px; font-weight: 600; line-height: 55px; margin: 0; }

/*=========================================================================
 Buttons
========================================================================= */

.donate-button { float:right; color:#777; padding:0 18px; }

.donate-button:hover { color: #fff; }

.newsletter-button { background: none repeat scroll 0 0 #FFFFFF; border: 1px solid rgba(0, 0, 0, 0.1); color: #828387; display: inline-block; padding: 2px 20px 2px; }

.newsletter-button:hover { background: none repeat scroll 0 0 #40AED7; border: 1px solid #65a121; color: #FFFFFF; text-decoration: none; }


/*=========================================================================
Icon Shake
========================================================================= */
#icon-shake h2 { float: left; line-height: 32px; font-size: 18px; font-weight: 100; }

#icon-shake { display: inline-block; margin:0 auto 30px; text-align: center; width: 100%; }

.icshake-wrapper { display: inline-block; text-align: center; }

#icon-shake .icon { margin-left: 20px; }
 #icon-shake .icon:nth-child(2n) {
 animation-name: keyframes1;
 animation-iteration-count: infinite;
 transform-origin: 50% 10%;
}
 #icon-shake .icon:nth-child(2n-1) {
 animation-name: keyframes2;
 animation-iteration-count: infinite;
 animation-direction: alternate;
 transform-origin: 30% 5%;
}
 @keyframes 
keyframes1 {  0% {
 transform: rotate(-1deg);
 animation-timing-function: ease-in;
}
 50% {
 transform: rotate(1.5deg);
 animation-timing-function: ease-out;
}
}
 @keyframes 
keyframes2 {  0% {
 transform: rotate(1deg);
 animation-timing-function: ease-in;
}
 50% {
 transform: rotate(-1.5deg);
 animation-timing-function: ease-out;
}
}

/*=========================================================================
 Portfolio
========================================================================= */


.heading { position: relative; text-align: center; width: 100%; }

.heading strong { background-color: #1ABC9C; color: #FFFFFF; display: inline-block; font-family: 'Open Sans', Arial, sans-serif; font-size: 21px !important; line-height: 30px !important; padding: 6px 31px !important; position: relative; text-transform: uppercase; -moz-border-radius: 2px;/*Firefox*/ -webkit-border-radius: 2px;/*Safari, Chrome*/ border-radius: 2px; -moz-box-shadow: 0px 1px 2px #cccccc;/*FF 3.5+*/ -webkit-box-shadow: 0px 1px 2px #cccccc;/*Saf3-4, Chrome, iOS 4.0.2-4.2, Android 2.3+*/ -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=2, Direction=180, Color=#cccccc)";/*IE 8*/ box-shadow: 0px 1px 2px #cccccc;  filter: progid:DXImageTransform.Microsoft.Shadow(Strength=2, Direction=180, Color=#cccccc);/*IE 5.5-7*/
}

.heading strong:after { border-color: #1ABC9C transparent; border-style: solid; border-width: 7px 7px 0; bottom: -7px; content: ""; display: block; left: 48%; position: absolute; width: 0; }

.heading span { color: #000000; display: block; font-size: 14px; font-weight: 400; line-height: 19px; margin-bottom: 3px; text-transform: none; }

.og-grid { list-style: none; text-align: center; width: 100%; }

.og-grid li { display: inline-block; margin: 40px 10px 0; vertical-align: top; }

.og-grid li > a img { border: none; outline: none; display: block; position: relative; width: 100%; -moz-border-radius: 100%;/*Firefox*/ -webkit-border-radius: 100%;/*Safari, Chrome*/ border-radius: 100%; }

.og-grid li > a { background: none repeat scroll 0 0 #FFFFFF; border: 1px solid #EEEEEE; display: block; padding: 10px; opacity: 1; position: relative; -moz-border-radius: 100%;/*Firefox*/ -webkit-border-radius: 100%;/*Safari, Chrome*/ border-radius: 100%; }

.og-grid li > a:hover { opacity: 0.7; }
 .og-grid li.og-expanded > a::after {
 top: auto;
 border: solid transparent;
 content: " ";
 height: 0;
 width: 0;
 position: absolute;
 pointer-events: none;
 border-bottom-color: #eee;
 border-width: 15px;
 left: 50%;
 margin: -8px 0 0 -15px;
}

.og-expander { position: absolute; background: #eee; top: auto; left: 0; width: 100%; margin-top: 10px; text-align: left; height: 0; overflow: hidden; }

.og-expander-inner { padding: 50px 30px; height: 100%; }

.og-close { position: absolute; width: 40px; height: 40px; top: 20px; right: 20px; cursor: pointer; }
 .og-close::before, .og-close::after {
 content: '';
 position: absolute;
 width: 100%;
 top: 50%;
 height: 1px;
 background: #888;
 -webkit-transform: rotate(45deg);
 -moz-transform: rotate(45deg);
 transform: rotate(45deg);
}
 .og-close::after {
 -webkit-transform: rotate(-45deg);
 -moz-transform: rotate(-45deg);
 transform: rotate(-45deg);
}
 .og-close:hover::before, .og-close:hover::after {
 background: #333;
}

.og-fullimg, .og-details { width: 50%; float: left; height: 100%; overflow: hidden; position: relative; }

.og-details { padding: 0 40px 0 20px; }

.og-fullimg { text-align: center; }

.og-fullimg img { background: none repeat scroll 0 0 #FFFFFF; border: 1px solid #CECECE; display: inline-block; padding: 10px; max-height: 100%; max-width: 100%; }

.og-details h3 { font-weight: 600; font-size: 42px; margin-bottom: 10px; }

.og-details p { font-weight: 400; font-size: 16px; line-height: 22px; color: #999; }

.og-details a { font-weight: 700; font-size: 16px; color: #333; text-transform: uppercase; letter-spacing: 2px; padding: 10px 20px; border: 3px solid #333; display: inline-block; margin: 30px 0 0; outline: none; }

.og-details a:hover { border-color: #999; color: #999; }

.og-loading { width: 20px; height: 20px; border-radius: 50%; background: #ddd; box-shadow: 0 0 1px #ccc, 15px 30px 1px #ccc, -15px 30px 1px #ccc; position: absolute; top: 50%; left: 50%; margin: -25px 0 0 -25px; -webkit-animation: loader 0.5s infinite ease-in-out both; -moz-animation: loader 0.5s infinite ease-in-out both; animation: loader 0.5s infinite ease-in-out both; }
 @-webkit-keyframes 
loader { 0% {
background: #ddd;
}
 33% {
background: #ccc;
box-shadow: 0 0 1px #ccc, 15px 30px 1px #ccc, -15px 30px 1px #ddd;
}
 66% {
background: #ccc;
box-shadow: 0 0 1px #ccc, 15px 30px 1px #ddd, -15px 30px 1px #ccc;
}
}
 @-moz-keyframes 
loader { 0% {
background: #ddd;
}
 33% {
background: #ccc;
box-shadow: 0 0 1px #ccc, 15px 30px 1px #ccc, -15px 30px 1px #ddd;
}
 66% {
background: #ccc;
box-shadow: 0 0 1px #ccc, 15px 30px 1px #ddd, -15px 30px 1px #ccc;
}
}
 @keyframes 
loader { 0% {
background: #ddd;
}
 33% {
background: #ccc;
box-shadow: 0 0 1px #ccc, 15px 30px 1px #ccc, -15px 30px 1px #ddd;
}
 66% {
background: #ccc;
box-shadow: 0 0 1px #ccc, 15px 30px 1px #ddd, -15px 30px 1px #ccc;
}

/*=========================================================================
 Portfolio
========================================================================= */

#filter { display: block; position: relative; text-align: center; width: 100%; margin-top: 50px; }

#filter li { display: inline-block; margin: 0 5px 0 0; overflow: hidden; padding: 0; }

#filter a { background: none repeat scroll 0 0 #FFFFFF; border: 1px solid #ECECEC; color: #5B5B5D; font-family: 'Fjalla One', sans-serif; display: block; outline: medium none; padding: 6px 16px; text-decoration: none; }

#filter a:hover { background: none repeat scroll 0 0 #D73604; border: 1px solid rgba(0, 0, 0, 0.1); color: #FFFFFF; }

#filter .active a { background: none repeat scroll 0 0 #303030; border: 1px solid #000000; color: #FFFFFF; outline: medium none; text-decoration: none; }

/*=========================================================================
 Scrool box
========================================================================= */
#jp-container1 .date { margin-bottom: 0; top: 3px !important; border-radius: 7px; -moz-border-radius: 7px; -webkit-border-radius: 7px; behavior: url(css/PIE.html); }

.jp-container { width:458px !important; height:251px !important; margin-bottom:20px; position:relative; background:#fff; border:1px solid #EEEEEE; float:left; }

.jp-container a { padding:15px 20px; display:block; line-height:20px; background-color: #fff; border-bottom:1px solid #EEEEEE; border-top:1px solid #FFFFFF; }

.jp-container a:first-child { border-top:none; }

.jp-container a:last-child { border-bottom:none; }

.jp-container a:hover { background:#F7F7F7; border-bottom-color:#FFFFFF; color: #303030; }

.jp-container a h3 { font-size:14px; font-weight: 600; margin-bottom: 8px; padding:2px 0 5px 0; text-transform:uppercase; }

.jp-container a img { float:left; margin:5px 10px 0px 0px; padding:3px; background:#fff; border:1px solid #D8DFEA; }

.jp-container a .testi-img-left { background: none; border: 0 none; bottom: 7px; float: left; margin: 0 10px 0 0; padding: 0; position: relative; }

.jp-container a .testi-img-right { background: none; border: 0 none; bottom: 7px; float: right; margin: 0 0 0 10px; padding: 0; position: relative; }

.jspContainer { overflow: hidden; position: relative; width: 458px !important; height:251px !important; }

.jspPane { position: absolute; width:458px !important; }

.jspVerticalBar { position: absolute; top: 0; right: 0; width: 14px; height: 100%; background:transparent; }

.jspHorizontalBar { position: absolute; bottom: 0; left: 0; width: 100%; height: 14px; background: transparent; }

.jspVerticalBar *, .jspHorizontalBar * { margin: 0; padding: 0; }

.jspCap { display: none; }

.jspHorizontalBar .jspCap { float: left; }

.jspTrack { background: none repeat scroll 0 0 #F9F9F9; position: relative; }

.jspDrag { background: url("../img/nav-scroll.html") no-repeat scroll 50% 50% #fff; box-shadow: 0 0 1px 0 #AAAAAA inset; position: relative; top: 0; left: 0; cursor: pointer; -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; }

.jspHorizontalBar .jspTrack, .jspHorizontalBar .jspDrag { float: left; height: 100%; }

.jspArrow { background: #50506d; text-indent: -20000px; display: block; cursor: pointer; }

.jspArrow.jspDisabled { cursor: default; background: #80808d; }

.jspVerticalBar .jspArrow { height: 16px; }

.jspHorizontalBar .jspArrow { width: 16px; float: left; height: 100%; }

.jspVerticalBar .jspArrow:focus { outline: none; }

.jspCorner { background: #eeeef4; float: left; height: 100%; }

/* Yuk! CSS Hack for IE6 3 pixel bug :( */
* html .jspCorner { margin: 0 -3px 0 0; }

/*=========================================================================
 Wmu Slider
========================================================================= */

/* Demo */
.wmuSlider, .wmuGallery { }

/* mwuSlider */
.wmuSlider { position: relative; overflow: visible; }

.wmuSlider .wmuSliderWrapper { display: none; }

.wmuSlider .wmuSliderWrapper article { position: relative; text-align: center; }

.wmuSlider .wmuSliderWrapper article img { max-width: 100%; width: auto; height: auto; }

/* mwuGallery */
.wmuGallery .wmuGalleryImage { position: relative; text-align: center; }

.wmuGallery .wmuGalleryImage img { max-width: 100%; width: auto; height: auto; }

/* Default Skin */
.wmuGallery .wmuGalleryImage { margin-bottom: 10px; }

.wmuSliderPrev, .wmuSliderNext { position: absolute; width: 40px; height: 80px; text-indent: -9999px; background: url(../img/sprites.html) no-repeat 0 0; top: 50%; margin-top: -40px; z-index: 2; }

.wmuSliderPrev { background-position: 100% 0; left: 20px; }

.wmuSliderNext { right: 20px; }

.wmuSliderPagination { z-index: 2; position: absolute; left: 20px; bottom: 10px; }

.wmuSliderPagination li { float: left; list-style-type: none; margin: 0 5px 0 0 !important; width: auto !important; }

.wmuSliderPagination a { display: block; text-indent: -9999px; width: 10px; height: 10px; background: url(../img/sprites.html) no-repeat 0 -80px; }

.wmuSliderPagination a.wmuActive { background-position: -10px -80px; }

/*=========================================================================
 Feature Boxes
========================================================================= */
.features { }

.features ul li li { background: none repeat scroll 0 0 #FFFFFF; border: 1px solid #EEEEEE; float: left; margin: 0 10px 20px; padding: 20px 20px 0px 20px; width: 258px; border-radius: 5px 5px 5px 5px; -moz-border-radius: 5px 5px 5px 5px; -webkit-border-radius: 5px 5px 5px 5px; behavior: url(css/PIE.html); }

/*=========================================================================
 Service Box
========================================================================= */
.box { display: inline-block; }

.box li { background: url("../img/vertical-line.html") no-repeat scroll right -39px transparent; float: left; padding: 0 20px; width: 200px; }

.box li:last-child { background: none repeat scroll 0 0 transparent; }

.box1 { text-align: center; }

.imgs { width: 48px; height: 48px; margin:0 auto; position:relative; z-index:2; }

.imgs img { position:absolute; top:0; left:0; }

.img-2 { opacity:0; z-index:2; }

.box1 h4 { color: #000; font-family: 'Open Sans', Arial; font-size: 19px; font-style: italic; font-weight: 600; padding: 20px 0 0 0; }

.box1:hover h4 { color: #0c374e; }

.box1 p { font-size: 13px; line-height: 18px; font-family: Arial, Helvetica, sans-serif; }

.box1:hover { }

.box1:hover .img-2 { opacity:1; z-index:2; }

.box1:hover .img-1 { opacity:0; }

.box1:hover h3 { color:#fff; text-shadow: 1px 1px 0 #C84233, 2px 2px 0 rgba(0, 0, 0, 0.3); }

.box1:hover p { color:#0c374e; }

.box2 { background: url("../img/transparent-white.html") repeat scroll 0 0 transparent; border: 1px solid #F3F3F3; border-radius: 5px 5px 5px 5px; -moz-border-radius: 5px 5px 5px 5px; -webkit-border-radius: 5px 5px 5px 5px; margin: 0 0 20px 0; padding:20px 0 20px 26px; position:relative; overflow:hidden; behavior: url(css/PIE.html); }

/*=========================================================================
 Quotes & Search
========================================================================= */

.quotes { width:592px; height:52px; position:relative; float:left; border-right:1px solid #eee; padding-top:6px; }

.quotes blockquote { font-size: 15px; line-height:22px; font-family: 'Open Sans', Arial; color:#828387; background: url(../img/icons/quotes.png) 0 3px no-repeat; padding:0 50px 0 64px; }

.quotes .flex-control-nav { position:relative; overflow:hidden; list-style:none; position:absolute; right:19px; bottom:1px; }

.quotes .flex-control-nav li { float:left; margin-right:3px; }

.quotes .flex-control-nav li a { display:block; background: none repeat scroll 0 0 #ccc; width:10px; height:10px; text-indent:-5000px; border-radius: 5px 5px 5px 5px; -moz-border-radius: 5px 5px 5px 5px; -webkit-border-radius: 5px 5px 5px 5px; behavior: url(css/PIE.html); }

.quotes .flex-control-nav li a:hover, .quotes .flex-control-nav li a.active { background: none repeat scroll 0 0 #40AED7; }

.search-ft { float: left; padding: 10px 0 0 20px; width: 280px; }

#search-ft { padding: 4px 0 0; }

#search-ft input { background: url("../img/icons/input-mail.jpg") no-repeat scroll 6px 8px #FBFBFC; border: 1px solid #E7E7E7; color: #A5A4A4; font-family: Arial, Helvetica, sans-serif; font-size: 11px; font-style: italic; font-weight: normal; margin: 0; outline: medium none; padding: 6px 5px 6px 28px; vertical-align: middle; width: 163px; }

#search-ft .button { padding: 3px 18px 5px; }

#search-ft input { width: 162px; }

.search { float:left; padding:10px 0 0 0; width:100%; }

/*=========================================================================
 Footer
========================================================================= */

.footer-1 h5 { color: #fff; text-shadow: 1px 1px 0 #000000, 2px 2px 0 #444444; }

/* About Text */
.about-brief { }

/* Twitter */
.tweets { width:100%; padding:0; font-size:12px; line-height:16px; overflow:hidden; }

.tweets ul li, .tweets p { font-size:12px; line-height:16px; }

.tweets ul li { background: url(../img/icons/bird-small.png) 8px 12px no-repeat rgba(0, 0, 0, 0.2); padding:10px 10px 10px 35px; margin:0 0 15px 0; box-shadow: 0 0 1px #666 inset; -moz-box-shadow: 0 0 1px #666 inset; -webkit-box-shadow: 0 0 1px #666 inset; }

.tweets ul li a { font-style:italic; font-weight:bold; font-size:12px; color:#40AED7; }

/* flickr */
.flickr ul li img { background-color: rgba(0, 0, 0, 0.17); border-radius: 4px 4px 4px 4px; -moz-border-radius: 4px 4px 4px 4px; -webkit-border-radius: 4px 4px 4px 4px; box-shadow: 0 1px 0 rgba(0, 0, 0, 0.3); -webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.3); -moz-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.3); float: left; margin-right: 12px; margin-top: 4px; padding: 6px; }

.flickr div { margin: 0; padding-bottom: 0; }

.flickr ul { }

.flickr ul li { float: left; margin: 0 10px 15px 0; }

.flickr ul li.empty { font-size: 0; margin: 0; }

.flickr ul li img { height: 51px; margin: 0; width: 51px; }

/* Sociable */
.sociable ul { }

.sociable ul li { margin-right: 5px; }

footer .sociable ul li { float: left; margin-right: 5px; margin-bottom: 15px; }

.social { position:relative; overflow:hidden; }

.social li { margin-right:5px; float: left; }

.social li:first-child { }

.social li a { display: block; font-family: Georgia, "Times New Roman", Times, serif; font-size: 13px; height: 26px; line-height: 25px; position: relative; }

.social li a:hover { color: #fff; }

.social li a img { padding-right: 5px; -webkit-transition:all 0.5s ease; -moz-transition:all 0.5s ease; -o-transition:all 0.5s ease; transition:all 0.5s ease; }

footer .social li a img { -webkit-transition:all 0.5s ease; -moz-transition:all 0.5s ease; -o-transition:all 0.5s ease; transition:all 0.5s ease; }

.social .img-1 { position:relative; z-index:2; opacity:1; }

.social .img-2 { z-index:3; opacity:0; position:absolute; top:0; left:0; }

.social li a:hover .img-2 { opacity:1; }

.social li a:hover .img-1 { opacity:0; }

/* back to top button */

#toTop { display:none; text-decoration:none; position:fixed; right:50%; bottom:31px; overflow:hidden; width:47px; height:47px; border:none; text-indent:-999px; z-index:20; background:url(../img/ui.totop.html) no-repeat 0 0 rgba(0, 0, 0, 0.3); border-radius: 50% 50% 50% 50%; -moz-border-radius: 50% 50% 50% 50%; -webkit-border-radius: 50% 50% 50% 50%; box-shadow: 0 0 0 7px rgba(0, 0, 0, 0.1); -webkit-box-shadow: 0 0 0 7px rgba(0, 0, 0, 0.1); -moz-box-shadow: 0 0 0 7px rgba(0, 0, 0, 0.1); behavior: url(css/PIE.html); }

#toTop:hover { background:url(../img/ui.totop.html) no-repeat 0 -57px rgba(255, 255, 255, 0.7); }

#toTop:active, #toTop:focus { outline:none; }
 @media only screen and (min-width: 768px) and (max-width: 959px) {
 
 /* Scrool box */
.jp-container {
width:362px !important;
height:251px !important;
}
.jspContainer {
width:362px !important;
height:251px !important;
}
.jspPane {
width:362px !important;
}

/* Client Logo */
.list-banners li {
 width: 123px;
}

/* Service Box */
.box li {
background: url("../img/vertical-line.html") no-repeat scroll right -23px transparent;
width: 152px;
}
 .features ul li li {
width: 194px;
}

/* Notificition */
.notify-left-text {
float: left;
width: 581px;
}
.tagline .notify-left-text h1 {
font-size: 22px;
float: left;
margin-bottom: 3px;
width: 581px;
}
 .notify {
width: 748px;
}
.notify h2 {
font-size: 21px;
}
.notify strong {
display:none;
}
.notify-2 {
width: 748px;
}
.notify-2 h2 {
font-size: 21px;
}
.notify-2 strong {
display:none;
}

/* Quotes */
.quotes {
width:460px;
}
.search-ft {
width:200px;
}
#search-ft input {
 width: 90px;
}
}
@media only screen and (max-width: 767px) {

/* Scrool box */
.jp-container {
width:298px !important;
height:251px !important;
}
.jspContainer {
width:298px !important;
height:251px !important
}
.jspPane {
width:298px !important;
}

/* Client Logo */
.list-banners li {
 width: 162px;
}
 .notify-left-text {
float: left;
margin-left: 0;
width: 298px;
}
.tagline .notify-left-text h1 {
font-size: 19px;
float: left;
line-height: 27px;
margin-bottom: 3px;
}
.notify-button {
 float: left;
}
 .notify-wrapper em {
display: none;
}
 .phone-separator:before {
 background: url("../img/phone-tail.html") repeat-x scroll 0 0 transparent;
bottom: 0;
content: "";
height: 2px;
left: 0;
position: absolute;
width: 100%;
}
.phone-separator {
display: inline-block;
margin-bottom: 30px;
padding-bottom: 12px;
position: relative;
width: 100%;
}

/* Service Box */
.box li {
background: none repeat scroll 0 0 transparent;
float: left;
padding: 0 0;
width: 100%;
}
 .features ul li li {
margin: 0 0 10px 0;
width: 258px;
}
.features ul .last {
margin: 0 0 20px 0;
}


/* Notificition */
.notify {
width: 297px;
}
.notify {
text-align: center;
}
.notify .icon-nf {
display: none;
}
.notify-wrapper {
display: inline-block;
float: none;
margin: 0;
}
.notify h2 {
width: 100%;
}
 .notify-2 {
width: 297px;
}
.notify-2 {
text-align: center;
}
.notify-2 .icon-nf {
display: none;
}
.notify-2 h2 {
width: 100%;
}
 a.button-demo:link, a.button-demo:visited, a.button-buy:link, a.button-buy:visited {
font: 12px 'OpenSansSemibold';
}
.notify em {
font-size: 17px;
line-height: 27px;
padding: 0 0;
}
.notify-2 em {
font-size: 17px;
line-height: 27px;
padding: 0 0;
}

/*Quotes & Search*/
.search {
width:270px;
padding:10px 0 0 0px;
}
.search-ft {
width: 229px;
}
#search-ft input {
width: 102px;
}
.quotes {
width:270px;
border:none;
height:110px;
}
.quotes blockquote {
padding:0 20px 0 64px;
}
/* back to top button */
#toTop {
display:none !important;
}
}
@media only screen and (min-width: 480px) and (max-width: 767px) {

/* Scrool box */
.jp-container {
width:418px !important;
height: 251px !important;
}
.jspContainer {
width:418px !important;
height: 251px !important;
}
.jspPane {
width:418px !important;
}

/* Client Logo */
.list-banners li {
 width: 138px;
}

/* Service Box */
.features ul li li {
margin: 0 0 10px 0;
width: 378px;
}
.features ul .last {
margin: 0 0 20px 0;
}
/* Notificition */
.notify-left-text {
float: left;
margin-left: 0;
width: 419px;
}
.tagline .notify-left-text h1 {
font-size: 26px;
float: left;
line-height: 36px;
margin-bottom: 3px;
}
.notify-button {
 float: left;
}
.notify {
width: 417px;
}
.notify h2 {
font-size: 18px;
width: 360px;
}
.notify-2 {
width: 417px;
}
.notify-2 h2 {
font-size: 18px;
width: 360px;
}

/*Quotes & Search*/
.search-ft {
width: 335px;
}
#search-ft input {
width: 223px;
}
.quotes {
width:370px;
height:80px;
}
.search {
width:370px;
}
}

.rw-words { display: inline; text-indent: 10px; }

.rw-words-1 span { position: absolute; opacity: 0; overflow: hidden; color: yellowgreen; -webkit-transform-origin: 10% 75%; -moz-transform-origin: 10% 75%; -ms-transform-origin: 10% 75%; -o-transform-origin: 10% 75%; transform-origin: 10% 75%; -webkit-animation: rotateWord 18s linear infinite 0s; -moz-animation: rotateWord 18s linear infinite 0s; -o-animation: rotateWord 18s linear infinite 0s; -ms-animation: rotateWord 18s linear infinite 0s; animation: rotateWord 18s linear infinite 0s; }
.rw-words span:nth-child(2) {
 -webkit-animation-delay: 3s;
 -moz-animation-delay: 3s;
 -o-animation-delay: 3s;
 -ms-animation-delay: 3s;
 animation-delay: 3s;
 color: royalblue;
}
.rw-words span:nth-child(3) {
 -webkit-animation-delay: 6s;
 -moz-animation-delay: 6s;
 -o-animation-delay: 6s;
 -ms-animation-delay: 6s;
 animation-delay: 6s;
 color: darkcyan;
}
.rw-words span:nth-child(4) {
 -webkit-animation-delay: 9s;
 -moz-animation-delay: 9s;
 -o-animation-delay: 9s;
 -ms-animation-delay: 9s;
 animation-delay: 9s;
 color: plum;
}
.rw-words span:nth-child(5) {
 -webkit-animation-delay: 12s;
 -moz-animation-delay: 12s;
 -o-animation-delay: 12s;
 -ms-animation-delay: 12s;
 animation-delay: 12s;
 color: saddlebrown;
}
.rw-words span:nth-child(6) {
 -webkit-animation-delay: 15s;
 -moz-animation-delay: 15s;
 -o-animation-delay: 15s;
 -ms-animation-delay: 15s;
 animation-delay: 15s;
 color: orange;
}
@-webkit-keyframes 
rotateWord { 0% {
opacity: 0;
}
 5% {
opacity: 1;
}
 17% {
opacity: 1;
-webkit-transform: rotate(0deg);
}
 19% {
opacity: 1;
-webkit-transform: rotate(98deg);
}
 21% {
opacity: 1;
-webkit-transform: rotate(86deg);
}
 23% {
opacity: 1;
-webkit-transform: translateY(85px) rotate(83deg);
}
 25% {
opacity: 0;
-webkit-transform: translateY(170px) rotate(80deg);
}
 80% {
opacity: 0;
}
 100% {
opacity: 0;
}
}
@-moz-keyframes 
rotateWord { 0% {
opacity: 0;
}
 5% {
opacity: 1;
}
 17% {
opacity: 1;
-moz-transform: rotate(0deg);
}
 19% {
opacity: 1;
-moz-transform: rotate(98deg);
}
 21% {
opacity: 1;
-moz-transform: rotate(86deg);
}
 23% {
opacity: 1;
-moz-transform: translateY(85px) rotate(83deg);
}
 25% {
opacity: 0;
-moz-transform: translateY(170px) rotate(80deg);
}
 80% {
opacity: 0;
}
 100% {
opacity: 0;
}
}
@-o-keyframes 
rotateWord { 0% {
opacity: 0;
}
 5% {
opacity: 1;
}
 17% {
opacity: 1;
-o-transform: rotate(0deg);
}
 19% {
opacity: 1;
-o-transform: rotate(98deg);
}
 21% {
opacity: 1;
-o-transform: rotate(86deg);
}
 23% {
opacity: 1;
-o-transform: translateY(85px) rotate(83deg);
}
 25% {
opacity: 0;
-o-transform: translateY(170px) rotate(80deg);
}
 80% {
opacity: 0;
}
 100% {
opacity: 0;
}
}
@-ms-keyframes 
rotateWord { 0% {
opacity: 0;
}
 5% {
opacity: 1;
}
 17% {
opacity: 1;
-ms-transform: rotate(0deg);
}
 19% {
opacity: 1;
-ms-transform: rotate(98deg);
}
 21% {
opacity: 1;
-ms-transform: rotate(86deg);
}
 23% {
opacity: 1;
-ms-transform: translateY(85px) rotate(83deg);
}
 25% {
opacity: 0;
-ms-transform: translateY(170px) rotate(80deg);
}
 80% {
opacity: 0;
}
 100% {
opacity: 0;
}
}
@keyframes 
rotateWord { 0% {
opacity: 0;
}
 5% {
opacity: 1;
}
 17% {
opacity: 1;
transform: rotate(0deg);
}
 19% {
opacity: 1;
transform: rotate(98deg);
}
 21% {
opacity: 1;
transform: rotate(86deg);
}
 23% {
opacity: 1;
transform: translateY(85px) rotate(83deg);
}
 25% {
opacity: 0;
transform: translateY(170px) rotate(80deg);
}
 80% {
opacity: 0;
}
 100% {
opacity: 0;
}
