/*
images Name: SWS
images URI: http://www.swsolutions.co.za
Description: SWS Evolution images
Version: 1.0
Author: Schalk Burger
Author URI: http://schalkburger.za.net
*/

@import "style/css/default.css";
@import "style/css/skeleton.css";

/* Table of Content
==================================================
	#Site Styles
	#Page Styles
	#Media Queries
	#Font-Face */

/* #Site Styles
================================================== */

body {
background: #F2F2F2 url(images/background.png) repeat-x;
font: 14px/21px "Helvetica Neue", Helvetica, Arial, sans-serif;
color: #444;
-webkit-font-smoothing: antialiased; /* Fix for webkit rendering */
-webkit-text-size-adjust: 100%;
}

#header {
width:900px;
margin:0 auto;
height:114px;
background:transparent url(images/header-bgr.png) no-repeat top left;
}

#header #sws-logo {
float:left;
width:177px;
height:60px;
margin-top:35px;
}

#header #sws-logo img {
margin-top:35px;
}

#header nav.primary {
float:left;
width:620px;
height:68px;
margin-top:45px;
padding-left:100px;
}

.sws-menu, .sws-menu * {
    list-style: none outside none;
    margin: 0;
    padding: 0;
}
.sws-menu {
    line-height: 1;
}
.sws-menu ul {
    background: url("images/sub-menu.png") repeat scroll 50% 0 transparent;
    border-radius: 16px 16px 16px 16px;
    position: absolute;
    top: -999em;
    width: 112px;
}
.sws-menu ul li {
    width: 100%;
}
.sws-menu li:hover {
    visibility: inherit;
}
.sws-menu li {
    float: left;
    position: relative;
}
.sws-menu a {
    display: block;
}
.sws-menu li:hover ul, .sws-menu li.sfHover ul {
    left: 50%;
    margin: 0 0 0 -54px;
    top: 36px;
    z-index: 99;
}
ul.sws-menu li:hover li ul, ul.sws-menu li.sfHover li ul {
    top: -999em;
}
ul.sws-menu li li:hover ul, ul.sws-menu li li.sfHover ul {
    left: 114px;
    margin: 0;
    top: 0;
}
ul.sws-menu li li:hover li ul, ul.sws-menu li li.sfHover li ul {
    top: -999em;
}
ul.sws-menu li li li:hover ul, ul.sws-menu li li li.sfHover ul {
    left: 10em;
    top: 0;
}
.sws-menu {
    float: right;
}
.sws-menu a {
    color: #808080;
    text-decoration: none;
}
.sws-menu li {
    background: url("images/menu-left.png") no-repeat scroll 5px -36px transparent;
}
.sws-menu li i {
    background: url("images/menu-divider.gif") no-repeat scroll 0 10px transparent;
    float: left;
    height: 34px;
    margin: 0 2px 0 -27px;
    overflow: hidden;
    width: 1px;
}
.sws-menu > li:first-child i {
    background: none repeat scroll 0 0 transparent;
}

.sws-menu li a {
    background: url("images/menu-right.png") no-repeat scroll 100% -36px transparent;
    color: #d8d9d9;
    float: left;
    font-size: 14px;
    font-weight: bold;
    height: 36px;
    line-height: 34px;
    padding: 0 28px;
    text-transform: uppercase;
}
.sws-menu li a:active {  
     color: #d8d9d9;
    outline: 0 none;
}
.sws-menu li li {
    background: none repeat scroll 0 0 transparent;
}
.sws-menu li li a {
    background: url("images/sub-menu-act.png") no-repeat scroll 0 -36px transparent;
    color: #FFFFFF;
    font-size: 11px;
    font-weight: normal;
    height: 36px;
    line-height: 36px;
    padding: 0;
    text-align: center;
    text-transform: uppercase;
    width: 112px;
}
.sws-menu li li li {
    background: none repeat scroll 0 0 transparent;
    padding: 0;
}
.sws-menu > li:hover, .sws-menu > li.sfHover {
    background-position: 5px 0;
    color: #2B2B2B;
    outline: 0 none;
}
.sws-menu li:hover > a, .sws-menu li.sfHover > a, .sws-menu li > a:hover {
    background-position: 100% 0;
    color: #2B2B2B;
    outline: 0 none;
}

.sws-menu li li:hover > a, .sws-menu li li.sfHover > a, .sws-menu li li > a:focus, .sws-menu li li > a:hover, .sws-menu li li > a:active {
    background-position: 0 0;
    color: #FFFFFF;
    outline: 0 none;
}
.sws-menu a.sf-with-ul {
    min-width: 1px;
    padding-right: 2.25em;
}

.sws-menu > li.current_page_item, li.current_page_parent {
    background-position: 5px 0;
    color: #2B2B2B;
    outline: 0 none;
}

.sws-menu li.current_page_item > a, li.current_page_parent a{
    background-position: 100% 0;
    color: #2B2B2B;
    outline: 0 none;
}

/* Main block */

#main-block {
position: relative;
margin:35px auto 0 auto;
width:920px;
background:#f1f2f3;
border:1px solid #ffffff;
-webkit-box-shadow: 0px 1px 1px 1px rgba(0, 0, 0, 0.1);
-moz-box-shadow: 0px 1px 1px 1px rgba(0, 0, 0, 0.1);
box-shadow: 0px 1px 1px 1px rgba(0, 0, 0, 0.1); 
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px; 
behavior: url(style/PIE.htc);
padding:20px 0 0 30px;
}

/* Post general */

.post {
padding:0 20px 0 15px;
}

.post strong {
color:#8B8B8B;
}

.post blockquote {
margin-left:20px;
}

.post h1{
font-family:'Open Sans', Arial, sans-serif;
font-weight:bold;
color:#4f5f6c;
font-size:22px;
}

.post h2 {
font-family:'Open Sans', Arial, sans-serif;
font-weight:bold;
color:#8b8b8b;
font-size:18px;
}

.post a{
color:#4f5f6c;
text-decoration:none;
}

.post p {
color:#8b8b8b;
font-size:14px;
padding:0 20px 20px 0;
margin:0;
line-height:150%;
}

.wp-caption p.wp-caption-text {
font-size:12px;
}

a.post-edit-link {
position:absolute;
bottom:10px;
right:15px;
text-decoration:none;
color:#ccc;
}


#footer {
margin-top:50px;
height:332px;
background:#E5E5E5 url(images/footer-bgr.png) repeat-x;
}

#footer-span {
width:900px;
margin:0 auto;
}

#footer-blocks {
width:960px;
margin:0 auto;
padding-top:40px;
}

#footer-blocks h2 {
font-size:18px;
font-weight:bold;
color:#5d5d5d
}

#footer-blocks ul li a {
text-decoration:none;
font-size:16px;
color:#5d5d5d;
}

#footer-blocks ul li a:hover {
text-decoration:underline;
color:#878686;
}

#footer-blocks .footer-block {
width:180px;
float:left;
background:url(images/footer-divider.png) no-repeat right 20px;
padding-left:40px;
padding-bottom:30px;
}

#footer-blocks .last-block {
background:none !important;
}

#footer-copy {
padding-left:40px;
clear:both;
}
#footer-copy p{
color:#a29e9e;
font-size:12px;
margin:0;
}

#footer-copy a{
text-decoration:none;
color:#a29e9e;
}

#footer-copy p.listed, #footer-copy p.listed a {
color:#c9c6c6;
}



/* #Page Styles
================================================== */

/* #Homepage
================================================== */


#flexslider-container {
position: relative;
margin:35px auto 0 auto;
width:960px;
height:365px;
background:#f5f5f5;
border:1px solid #d9d6d6;
-webkit-box-shadow: 0px 1px 1px 1px rgba(0, 0, 0, 0.1);
-moz-box-shadow: 0px 1px 1px 1px rgba(0, 0, 0, 0.1);
box-shadow: 0px 1px 1px 1px rgba(0, 0, 0, 0.1); 
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px; 
behavior: url(style/PIE.htc);
}

#flexslider-container h2 {
font-family:'Open Sans', Arial, sans-serif;
font-size:28px;
color:#585a5b;
padding:40px 0 20px 55px;
}

#flexslider-container p {
font-family:Arial, sans-serif;
font-size:20px;
color:#898A8B;
padding:0px 0 20px 55px;
line-height:150%;
margin:0;
}
#flexslider-container a {
color:#909FAD;
text-decoration:none;
}

#flexslider-container .websites {
width:338px;
height:334px;
background:url(images/SWS-Slides.jpg) no-repeat;
background-position:0 20px;
padding:0 12px 0 20px
}
#flexslider-container .eco {
width:338px;
height:334px;
background:url(images/SWS-Slides.jpg) no-repeat;
background-position:-338px 20px;
padding-left:20px
}
#flexslider-container .faq {
width:338px;
height:334px;
background:url(images/SWS-Slides.jpg) no-repeat;
background-position:-1028px 20px;
padding-left:20px
}
#flexslider-container .social {
width:338px;
height:334px;
background:url(images/SWS-Slides.jpg) no-repeat;
background-position:-684px 20px;
padding-left:20px
}


/*
 * jQuery FlexSlider v1.8
 * http://flex.madebymufffin.com
 *
 * Copyright 2011, Tyler Smith
 * Free to use under the MIT license.
 * http://www.opensource.org/licenses/mit-license.php
 */
 
/* Browser Resets */
.flex-container a:active,
.flexslider a:active {outline: none;}
.slides,
.flex-control-nav,
.flex-direction-nav {margin: 0; padding: 0; list-style: none;} 

/* FlexSlider Necessary Styles
*********************************/ 
.flexslider {width: 100%; margin: 0; padding: 0;}
.flexslider .slides > li {display: none;} /* Hide the slides before the JS is loaded. Avoids image jumping */
.flexslider .slides img {max-width: 100%; display: block;}
.flex-pauseplay span {text-transform: capitalize;}

/* Clearfix for the .slides element */
.slides:after {content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0;} 
html[xmlns] .slides {display: block;} 
* html .slides {height: 1%;}

/* No JavaScript Fallback */
/* If you are not using another script, such as Modernizr, make sure you
 * include js that eliminates this class on page load */
.no-js .slides > li:first-child {display: block;}


/* FlexSlider Default images
*********************************/
.flexslider {background: none; position: relative; -webkit-border-radius: 5px; -moz-border-radius: 5px; -o-border-radius: 5px; border-radius: 5px; zoom: 1;}
.flexslider .slides {zoom: 1;}
.flexslider .slides > li {position: relative;}
/* Suggested container for "Slide" animation setups. Can replace this with your own, if you wish */
.flex-container {zoom: 1; position: relative;}

/* Caption style */
/* IE rgba() hack */
.flex-caption {background:none; -ms-filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#4C000000,endColorstr=#4C000000);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#4C000000,endColorstr=#4C000000); zoom: 1;}
.flex-caption {width: 96%; padding: 2%; position: absolute; left: 0; bottom: 0; background: rgba(0,0,0,.3); color: #fff; text-shadow: 0 -1px 0 rgba(0,0,0,.3); font-size: 14px; line-height: 18px;}

/* Direction Nav */
.flex-direction-nav li a {width: 53px; height: 52px; margin: -13px 0 0; display: block; background: url(images/bg_direction_nav.png) no-repeat 0 0; position: absolute; top: 50%; cursor: pointer; text-indent: -9999px;}
.flex-direction-nav li .next {background-position: -53px 0; right: -21px;}
.flex-direction-nav li .prev {left: -20px;}
.flex-direction-nav li .disabled {opacity: .3; filter:alpha(opacity=30); cursor: default;}

/* Control Nav */
.flex-control-nav {width: 100%; position: absolute; bottom: -30px; text-align: center;}
.flex-control-nav li {margin: 0 0 0 5px; display: inline-block; zoom: 1; *display: inline;}
.flex-control-nav li:first-child {margin: 0;}
.flex-control-nav li a {width: 13px; height: 13px; display: block; background: url(images/bg_control_nav.png) no-repeat 0 0; cursor: pointer; text-indent: -9999px;}
.flex-control-nav li a:hover {background-position: 0 -13px;}
.flex-control-nav li a.active {background-position: 0 -26px; cursor: default;}

/* Slides */

img.slide-01 {
margin:15px 45px 0 30px;
}
img.slide-02 {
margin:15px 45px 0 30px;
}


.services-blocks {
height:350px;
}

.services-blocks h2{
font-family:'Open Sans', Arial, sans-serif;
font-weight:bold;
color:#4f5f6c;
font-size:18px;
}

.services-blocks a{
color:#4f5f6c;
text-decoration:none;
}

.services-blocks p {
color:#8b8b8b;
font-size:16px;
padding-top:15px;
}

img.service-image {
border:5px solid #fff;
-webkit-box-shadow: 0px 2px 3px 2px rgba(0, 0, 0, 0.1);
-moz-box-shadow: 0px 2px 3px 2px rgba(0, 0, 0, 0.1);
box-shadow: 0px 2px 3px 2px rgba(0, 0, 0, 0.1); 
behavior: url(style/PIE.htc);
}

.services-blocks a.button {
width:250px;
height:30px;
background:#F1F2F3 url(images/services-button-bgr.png) repeat-x;
border:1px solid #ccc;
color:#4f4f4f;
text-shadow: 1px 2px 2px #ffffff;
font-size:20px;
font-weight:bold;
text-align:center;
padding:10px 0 0 0 ;
behavior: url(style/PIE.htc);
}

.services-blocks a.button:hover {
background:url(images/services-button-bgr-hover.png) repeat-x;
}

.services-blocks a.button:active {
background:url(images/services-button-bgr-active.png) repeat-x;
}

#bottom-blocks {
position: relative;
margin:20px auto 0 auto;
width:920px;
background:none;
padding:20px 0 0 30px;
}

#bottom-blocks ul {
color:#8b8b8b;
}

#bottom-blocks h2{
font-family:'Open Sans', Arial, sans-serif;
font-weight:bold;
color:#1c1c1c;
font-size:24px;
padding-bottom:5px;
}

#bottom-blocks a{
color:#4f5f6c;
text-decoration:none;
}

#bottom-blocks p {
color:#8b8b8b;
font-size:14px;
padding:0px 0 15px 0;
margin:0;
}

.quote {
width:255px;
background:#FFFFFF;
-webkit-box-shadow: 2px 1px 1px 1px rgba(0, 0, 0, 0.1);
-moz-box-shadow: 2px 1px 1px 1px rgba(0, 0, 0, 0.1);
box-shadow: 2px 1px 1px 1px rgba(0, 0, 0, 0.1); 
-webkit-border-radius: 15px;
-moz-border-radius: 15px;
border-radius: 15px; 
position:relative;
}

.quote-arrow {
background:transparent url(images/quote-arrow.png) no-repeat 30px 0;
height:28px;
margin-top:-1px;
position:relative;
}

.quote p.quote-text {
margin:0;
padding:15px !important;
color:#848383;
font-family:Georgia, "Times New Roman", serif;
font-style:italic;
font-size:12px;
}

.quote p.quote-author {
position:absolute;
bottom:-60px;
left:70px;
}

/* #About page
================================================== */

.about {
height:440px;
}

.about a.button {
background-color: #57A957;
background-repeat: repeat-x;
background-image: -khtml-gradient(linear, left top, left bottom, from(#62c462), to(#57a957));
background-image: -moz-linear-gradient(top, #62c462, #57a957);
background-image: -ms-linear-gradient(top, #62c462, #57a957);
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #62c462), color-stop(100%, #57a957));
background-image: -webkit-linear-gradient(top, #62c462, #57a957);
background-image: -o-linear-gradient(top, #62c462, #57a957);
background-image: linear-gradient(top, #62c462, #57a957);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#62c462', endColorstr='#57a957', GradientType=0);
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
border-color: #57A957 #57A957 #3D773D;
border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
color:#fff;
behavior: url(style/PIE.htc);
}

.bold {
font-weight:bold;
}

#twitter {
width:240px;
height:37px;
margin-left:10px;
}

#twitter img {
float:left;
margin:0 5px 0 0;
}

#twitter a {
 font-family: "lucida grande",tahoma,verdana,arial,sans-serif;
color:#3B5998;
font-size:14px;
cursor: pointer;
font-weight: bold;
margin:0 0 0 5px;
line-height:35px;
}

#twitter span {
font-size: 11px;
padding-left: 5px;
font-family:"lucida grande",tahoma,verdana,arial,sans-serif;
}

#linkedin{
margin-top:10px;
width:240px;
height:37px;
margin-left:10px;
}

#linkedin img {
float:left;
margin:0 5px 0 0;
}

#linkedin a {
 font-family: "lucida grande",tahoma,verdana,arial,sans-serif;
color:#3B5998;
font-size:14px;
cursor: pointer;
font-weight: bold;
margin:0 0 0 5px;
line-height:35px;
}

#valued-clients {
position: relative;
margin:20px auto 0 auto;
width:920px;
background:none;
padding:20px 0 60px 30px;
clear:both;
}

#valued-clients img {
float:left;
margin:0 20px 0 0;
}

#valued-clients h2{
font-family:'Open Sans', Arial, sans-serif;
font-weight:bold;
color:#1c1c1c;
font-size:24px;
padding-bottom:5px;
}

/* #Contact page
================================================== */

.contact {
height:440px;
}

.contact-form {
float:right;
width:240px;
margin-left:50px;
position:relative;
}
.contact-form p {
padding:0;
}

.contact-form #wpcf7-f21-p11-o1 input {
margin:0 0 5px 0;
}
.contact-form #wpcf7-f21-p11-o1 input.wpcf7-submit {
margin:-10px 0 0 0;
}
.contact-form #wpcf7-f21-p11-o1 .wpcf7-not-valid-tip {
margin-top:-5px;
}
.contact-form #wpcf7-f21-p11-o1 .wpcf7-response-output {
margin:0;
bottom:20px;
}


/* #Webdesign page
================================================== */

.webdesign {
height:540px;
}

.add-margin {
margin:20px 40px 0 0;
}

#feature-boxes {
width:800px;
padding:0 0 0 15px;
}

.feature {
width:340px;
float:left;
margin:0 50px 15px 0;
}

.feature h2 {
color:#4f5f6c;
font-size:16px;
margin:0;
padding:0 0 0px 0;
}

.feature img {
float:left;
margin:5px 17px 20px 0;
}

#interest {
clear:both;
margin:20px 0 0 100px;
}

#interest p {
float:left;
}

img.arrow-right {
float:left;
margin:-5px 15px 0 15px;
}

.webdesign a.button {
background-color: #57A957;
background-repeat: repeat-x;
background-image: -khtml-gradient(linear, left top, left bottom, from(#62c462), to(#57a957));
background-image: -moz-linear-gradient(top, #62c462, #57a957);
background-image: -ms-linear-gradient(top, #62c462, #57a957);
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #62c462), color-stop(100%, #57a957));
background-image: -webkit-linear-gradient(top, #62c462, #57a957);
background-image: -o-linear-gradient(top, #62c462, #57a957);
background-image: linear-gradient(top, #62c462, #57a957);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#62c462', endColorstr='#57a957', GradientType=0);
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
border-color: #57A957 #57A957 #3D773D;
border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
color:#fff;
behavior: url(style/PIE.htc);
}

/* #Hosting page
================================================== */

.hosting {
height:520px;
}

#hosting-boxes {
width:800px;
margin-top:20px;
}

.hosting-block {
width:180px;
float:left;
background:url(images/hosting-divider.png) no-repeat top right;
padding:0 0 0 50px;
}

.hosting-block h2 {
color:#7f7f7f;
font-weight:bold;
font-size:28px;
}
.hosting-block h2 span {
font-size:18px;
}
.hosting-block h3 {
color:#4c7a9f;
font-size:18px;
margin-top:-20px;
}
.hosting-block ul {
color:#a7a6a6;
font-size:16px;
}

.hosting-block a.button {
background-color: #57A957;
background-repeat: repeat-x;
background-image: -khtml-gradient(linear, left top, left bottom, from(#62c462), to(#57a957));
background-image: -moz-linear-gradient(top, #62c462, #57a957);
background-image: -ms-linear-gradient(top, #62c462, #57a957);
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #62c462), color-stop(100%, #57a957));
background-image: -webkit-linear-gradient(top, #62c462, #57a957);
background-image: -o-linear-gradient(top, #62c462, #57a957);
background-image: linear-gradient(top, #62c462, #57a957);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#62c462', endColorstr='#57a957', GradientType=0);
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
border-color: #57A957 #57A957 #3D773D;
border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
color:#fff;
behavior: url(style/PIE.htc);
}

/* #Hosting sign up pages
================================================== */

#wpcf7-f893-p891-o1 div.wpcf7-validation-errors {
background: url("images/icon-alert.png") no-repeat scroll 0 0 transparent;
border: medium none;
bottom: 50px;
height: 20px;
left: 200px;
position: absolute;
width: 450px;
}

#wpcf7-f893-p891-o1 div.wpcf7-mail-sent-ok {
background: url("images/icon-ok.png") no-repeat scroll 0 0 transparent;
border: medium none;
bottom: 50px;
height: 20px;
left: 200px;
position: absolute;
width: 450px;
}

#wpcf7-f910-p908-o1 div.wpcf7-validation-errors {
background: url("images/icon-alert.png") no-repeat scroll 0 0 transparent;
border: medium none;
bottom: 50px;
height: 20px;
left: 200px;
position: absolute;
width: 450px;
}

#wpcf7-f910-p908-o1  span.wpcf7-not-valid-tip {
background: none repeat scroll 0 0 #FDDFDE;
font-size: 10pt;
height: 23px;
left: 2px;
padding: 5px 0 0 5px;
position: absolute;
top: -34px;
width: 211px;
z-index: 100;
font-weight:bold;
}

#wpcf7-f910-p908-o1 div.wpcf7-mail-sent-ok {
background: url("images/icon-ok.png") no-repeat scroll 0 0 transparent;
border: medium none;
bottom: 50px;
height: 20px;
left: 200px;
position: absolute;
width: 450px;
}

#wpcf7-f905-p904-o1 div.wpcf7-validation-errors {
background: url("images/icon-alert.png") no-repeat scroll 0 0 transparent;
border: medium none;
bottom: 50px;
height: 20px;
left: 200px;
position: absolute;
width: 450px;
}

#wpcf7-f905-p904-o1  span.wpcf7-not-valid-tip {
background: none repeat scroll 0 0 #FDDFDE;
font-size: 10pt;
height: 23px;
left: 2px;
padding: 5px 0 0 5px;
position: absolute;
top: -34px;
width: 211px;
z-index: 100;
font-weight:bold;
}

#wpcf7-f905-p904-o1 div.wpcf7-mail-sent-ok {
background: url("images/icon-ok.png") no-repeat scroll 0 0 transparent;
border: medium none;
bottom: 50px;
height: 20px;
left: 200px;
position: absolute;
width: 450px;
}


/* #Marketing page
================================================== */

.marketing {
height:540px;
}

.add-margin {
margin:20px 40px 0 0;
}

#feature-boxes {
width:800px;
padding:0 0 0 15px;
}

.feature {
width:340px;
float:left;
margin:0 50px 15px 0;
}

.feature h2 {
color:#4f5f6c;
font-size:16px;
margin:0;
padding:0 0 0px 0;
}

.feature img {
float:left;
margin:5px 17px 20px 0;
}

#interest {
clear:both;
margin:20px 0 0 100px;
}

#interest p {
float:left;
}

img.arrow-right {
float:left;
margin:-5px 15px 0 15px;
}

.marketing a.button {
background-color: #57A957;
background-repeat: repeat-x;
background-image: -khtml-gradient(linear, left top, left bottom, from(#62c462), to(#57a957));
background-image: -moz-linear-gradient(top, #62c462, #57a957);
background-image: -ms-linear-gradient(top, #62c462, #57a957);
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #62c462), color-stop(100%, #57a957));
background-image: -webkit-linear-gradient(top, #62c462, #57a957);
background-image: -o-linear-gradient(top, #62c462, #57a957);
background-image: linear-gradient(top, #62c462, #57a957);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#62c462', endColorstr='#57a957', GradientType=0);
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
border-color: #57A957 #57A957 #3D773D;
border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
color:#fff;
behavior: url(style/PIE.htc);
}

/* #Portfolio page
================================================== */

.portfolio-block {
height:auto;
}

.group:after {
    clear: both;
    content: "";
    display: block;
    height: 0;
    visibility: hidden;
	margin-bottom:-20px;
}

/* Filter */
dl { margin-bottom: 3em; color: #777; }
dt, dd { float: left; }
dt { margin-right: 20px; margin-top:-2px;}
.filter li { float: left; margin-right:10px; }
.filter li:last-child:after { content: ""; }
.filter a { padding: 0 10px; color: #777; text-decoration: none; }
.filter a:hover, .current a { color: #4B4B4B; }
.filter .current a {
border:1px solid #bbb;
background:#DFDFDF;
padding:3px 15px;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px; 
box-shadow: inset 0 1px 5px #ccc;
-moz-box-shadow: inset 0 1px 5px #ccc;
-webkit-box-shadow: inset 0 1px 5px #ccc;
behavior: url(style/PIE.htc);
}

/* Portfolio Items */
.portfolio li { float: left; margin-right: 20px; background:#F9F9F9;margin-bottom: 2em; border: 1px solid #ccc; -moz-box-shadow: 0 5px 5px -3px #222; -webkit-box-shadow: 0 5px 5px -3px #222; box-shadow: 0 5px 5px -3px #222;behavior: url(style/PIE.htc); text-align:center;padding:0 0 5px 0;color:#89949D;}

.portfolio a { display: block; border: 3px solid #fff;  text-decoration: none; }
.portfolio img { width: 260px; height: 159px; display: block; border: 1px solid #ccc; }
.portfolio p {font-size:14px;text-align:center;margin:0;padding:3px 0 7px 0}

.portfolio img:hover {
opacity:0.5;
}


/* #Hosting Sign up
================================================== */

#post-891 #hosting-form, #post-904 #hosting-form, #post-908 #hosting-form {
width:550px;
margin:20px auto 30px auto;
padding:30px 100px;
border:1px solid #D8D9D9;
background:#F5F5F5;
position:relative;
}

#post-891 h1, #post-904 h1, #post-908 h1 {
padding:0 0 0 80px;
}

#post-891 h2, #post-904 h2, #post-908 h2 {
border-bottom:1px solid #ccc;
margin-bottom:15px;
color:#4F5F6C;
}

#post-891 #hosting-intro-basic {
background:url(images/icon-hosting-basic.png) no-repeat 710px 0;
}

#post-904 #hosting-intro-standard {
background:url(images/icon-hosting-standard.png) no-repeat 710px 0;
}

#post-908 #hosting-intro-premium {
background:url(images/icon-hosting-premium.png) no-repeat 710px 0;
}

#post-891 #hosting-intro-basic p, #post-904 #hosting-intro-standard p, #post-908 #hosting-intro-premium p{
width:700px;
margin:0 auto;
}


#wpcf7-f893-p891-o1 span.wpcf7-list-item, #wpcf7-f905-p904-o1 span.wpcf7-list-item, #wpcf7-f910-p908-o1 span.wpcf7-list-item {
    float: left;
	margin-top:10px;
    margin-bottom: 10px;
}

#wpcf7-f893-p891-o1 div.wpcf7-validation-errors, #wpcf7-f905-p904-o1 div.wpcf7-validation-errors, #wpcf7-f910-p908-o1 div.wpcf7-validation-errors{
background: url("images/icon-alert.png") no-repeat scroll 0 0 transparent;
border: medium none;
bottom: 50px;
height: 20px;
left: 200px;
position: absolute;
width: 450px;
}

#wpcf7-f893-p891-o1  span.wpcf7-not-valid-tip, #wpcf7-f905-p904-o1 span.wpcf7-not-valid-tip, #wpcf7-f910-p908-o1 span.wpcf7-not-valid-tip {
background: none repeat scroll 0 0 #FDDFDE;
font-size: 10pt;
height: 23px;
padding: 5px 0 0 5px;
width: 215px;
z-index: 100;
font-weight:bold;
display:block;
margin-top:-20px;
}

/* #Worksheet
================================================== */

#post-37 {
overflow:auto;
}

#post-37 h1 {
padding:0 0 0 80px;
}

#post-37 h2 {
border-bottom:1px solid #ccc;
margin-bottom:15px;
color:#4F5F6C;
}

#post-37 #worksheet-intro p {
width:700px;
margin:0 auto;
}

#post-37 #worksheet-intro strong {
padding:0 0 0 80px;
}

#post-37 #worksheet-form {
width:550px;
margin:20px auto 30px auto;
padding:30px 100px;
border:1px solid #D8D9D9;
background:#F5F5F5;
position:relative;
}

#wpcf7-f109-p37-o1.wpcf7 form.wpcf7-form p span.wpcf7-form-control-wrap input.wpcf7-text {margin:0;}

#wpcf7-f109-p37-o1 span.wpcf7-list-item {
    float: left;
    margin-bottom: 10px;
}

#wpcf7-f109-p37-o1 textarea {
   width:500px;
   height:150px;
}

#wpcf7-f109-p37-o1 div.wpcf7-validation-errors {
background: url("images/icon-alert.png") no-repeat scroll 0 0 transparent;
border: medium none;
bottom: 50px;
height: 20px;
left: 200px;
position: absolute;
width: 450px;
}

#wpcf7-f109-p37-o1 span.wpcf7-not-valid-tip {
background: none repeat scroll 0 0 #FDDFDE;
font-size: 10pt;
height: 23px;
padding: 5px 0 0 5px;
width: 213px;
z-index: 100;
font-weight:bold;
display:block;
}

#wpcf7-f109-p37-o1 div.wpcf7-mail-sent-ok {
background: url("images/icon-ok.png") no-repeat scroll 0 0 transparent;
border: medium none;
bottom: 50px;
height: 20px;
left: 200px;
position: absolute;
width: 450px;
}

/* #Webmail
================================================== */

.webmail {
height:250px;
}

.webmail h2 {
margin:-15px 0 0 0;
}

.webmail-main ol {
list-style:none;
}
.webmail-main ol li {
float:left;
width:230px;
}

.webmail-main ol li button{
margin:35px 0 0 0;
}

/* #Page
================================================== */

.page {
height:auto;
}

.page .post {
padding-bottom:20px;
}

/* Colorbox */

/*
    ColorBox Core Style:
    The following CSS is consistent between example themes and should not be altered.
*/
#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative;}
#cboxLoadedContent{overflow:auto;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
.cboxPhoto{float:left; margin:auto; border:0; display:block;}
.cboxIframe{width:100%; height:100%; display:block; border:0;}

/* 
    User Style:
    Change the following styles to modify the appearance of ColorBox.  They are
    ordered & tabbed in a way that represents the nesting of the generated HTML.
*/
#cboxOverlay{background:url(images/overlay.png) repeat 0 0;}
#colorbox{}
    #cboxTopLeft{width:21px; height:21px; background:url(images/controls.png) no-repeat -101px 0;}
    #cboxTopRight{width:21px; height:21px; background:url(images/controls.png) no-repeat -130px 0;}
    #cboxBottomLeft{width:21px; height:21px; background:url(images/controls.png) no-repeat -101px -29px;}
    #cboxBottomRight{width:21px; height:21px; background:url(images/controls.png) no-repeat -130px -29px;}
    #cboxMiddleLeft{width:21px; background:url(images/controls.png) left top repeat-y;}
    #cboxMiddleRight{width:21px; background:url(images/controls.png) right top repeat-y;}
    #cboxTopCenter{height:21px; background:url(images/border.png) 0 0 repeat-x;}
    #cboxBottomCenter{height:21px; background:url(images/border.png) 0 -29px repeat-x;}
    #cboxContent{background:#fff; overflow:hidden;}
        .cboxIframe{background:#fff;}
        #cboxError{padding:50px; border:1px solid #ccc;}
        #cboxLoadedContent{margin-bottom:28px;}
        #cboxTitle{position:absolute; bottom:4px; left:0; text-align:center; width:100%; color:#949494;}
        #cboxCurrent{position:absolute; bottom:4px; left:58px; color:#949494;}
        #cboxSlideshow{position:absolute; bottom:4px; right:30px; color:#0092ef;}
        #cboxPrevious{position:absolute; bottom:0; left:0; background:url(images/controls.png) no-repeat -75px 0; width:25px; height:25px; text-indent:-9999px;}
        #cboxPrevious:hover{background-position:-75px -25px;}
        #cboxNext{position:absolute; bottom:0; left:27px; background:url(images/controls.png) no-repeat -50px 0; width:25px; height:25px; text-indent:-9999px;}
        #cboxNext:hover{background-position:-50px -25px;}
        #cboxLoadingOverlay{background:url(images/loading_background.png) no-repeat center center;}
        #cboxLoadingGraphic{background:url(images/loading.gif) no-repeat center center;}
        #cboxClose{position:absolute; bottom:0; right:0; background:url(images/controls.png) no-repeat -25px 0; width:25px; height:25px; text-indent:-9999px;}
        #cboxClose:hover{background-position:-25px -25px;}

/*
  The following fixes a problem where IE7 and IE8 replace a PNG's alpha transparency with a black fill
  when an alpha filter (opacity change) is set on the element or ancestor element.  This style is not applied to or needed in IE9.
  See: http://jacklmoore.com/notes/ie-transparency-problems/
*/
.cboxIE #cboxTopLeft,
.cboxIE #cboxTopCenter,
.cboxIE #cboxTopRight,
.cboxIE #cboxBottomLeft,
.cboxIE #cboxBottomCenter,
.cboxIE #cboxBottomRight,
.cboxIE #cboxMiddleLeft,
.cboxIE #cboxMiddleRight {
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF);
}


/* #Blog start
================================================== */

.blog {
height:auto;
width:630px !important;
float:left;
}

.blog h1 {
color: #4F5F6C;
font-family: 'Open Sans',Arial,sans-serif;
font-size: 28px;
font-weight: bold;
margin:0 0 20px 25px;
}

.blog .post {
margin:0 0 25px 0;
}

.blog .post h2.post-title {
padding:15px 0 0 0px;
}

.blog .post h2, .blog .post h2 a {
color:#8b8b8b;
font-size:24px;
padding:15px 0 0 10px;
}

.blog .post .meta {
border-top:1px solid #d6d7d8;
background:#f6f6f7;
height:35px;
margin-bottom:10px;
margni-left:10px;
}

.blog .post .meta p {
color:#c3c5c5;
font-size:14px;
padding:5px 0 0 10px;
}

.blog .post .meta p a{
color:#c3c5c5;
}

.blog .post p {
font-size:14px;
padding:10px 5px 0 10px;
}

.blog .post img.attachment-post-thumbnail {
float:right;
margin:0 10px 15px 15px;
-webkit-box-shadow: 3px 2px 3px 1px rgba(0, 0, 0, 0.1);
-moz-box-shadow: 3px 2px 3px 1px rgba(0, 0, 0, 0.1);
box-shadow: 3px 2px 3px 1px rgba(0, 0, 0, 0.1); 
behavior: url(style/PIE.htc);
}

.blog .post .wp-caption {
border:3px solid #DFDFDF;
background:#fff;
margin:20px 0;
}

.blog .post .wp-caption img{
margin:5px 0 0 0;
}

.blog .post .wp-caption p.wp-caption-text {
padding:3px 0 5px 0;
}

.blog .post ul {
list-style:disc;
margin:15px 0 0 30px;
color:#8B8B8B;
}

.blog .post ol {
margin:25px 0 0 40px;
color:#8B8B8B;
}


.blog .post h3 {
color: #8B8B8B;
font-size: 20px;
padding: 15px 0 0 10px;
}


/* Comments */

h2.comments-header {
font-size:20px;
color:#8B8B8B;
margin:0 0 15px 20px;
}

p.comment-first {
padding:0 0 0 20px;
}

#comments-form {
margin:0 0 0 20px;
}

#comments-form h2 {
font-size:20px;
color:#8B8B8B;
}
#comments-form h2 a {
text-decoration:none;
color:#8B8B8B;
}

#comments-form label {
color:#8B8B8B;
}

#comments-form textarea {
clear:both;
width:440px;
}


ol#comments {
list-style:none;
margin:0 0 0 20px;
}

ol#trackbacks {
list-style:none;
margin:0 0 0 20px;
}

.comment-author {
font-weight:bold;
}

.comment-text {
padding:10px;
background:#fff;
-webkit-box-shadow: 3px 2px 3px 1px rgba(0, 0, 0, 0.1);
-moz-box-shadow: 3px 2px 3px 1px rgba(0, 0, 0, 0.1);
box-shadow: 3px 2px 3px 1px rgba(0, 0, 0, 0.1); 
behavior: url(style/PIE.htc);
margin:10px 0 15px 0;
width:560px;
}

.highlight .comment-text {
background:#F4F7F9;
}

.form-author {
float:left;
margin:0 5px 0 0 ;
}

.form-email {
float:left;
}

/* #404 page
================================================== */

.p404 {
height:380px;
}


/* Sidebar */

#sidebar {
float:left;
width:250px;
margin:50px 0 0 20px;
}

#sidebar h2 {
font-family: 'Open Sans',Arial,sans-serif;
color:#4f5f6c;
font-size: 22px;
font-weight:bold;
}

#sidebar #text-3 {
margin:20px 0 0 0;
}

#sidebar #text-3 .textwidget {
margin:-10px 0 0 0;
}

#sidebar p.blog-intro {
color:#8b8b8b;
font-size:12px;
}

#sidebar p.blog-intro a{
color:#697278;
}

#sidebar .headline {
font-family: 'Open Sans',Arial,sans-serif;
color:#4f5f6c;
font-size: 22px;
margin:0 0 20px 0;
font-weight:bold;
}

#sidebar #categories-3 ul{
margin:0;
}

#sidebar #categories-3 ul li {
background: none repeat scroll 0 0 #F1F1F1;
border-bottom: 1px solid #C3C2C2;
padding: 5px 0 5px 10px;
width: 215px;
}

#sidebar #categories-3 ul li a {
color:#8b8b8b;
font-weight:bold;
text-decoration:none;
}

#sidebar #categories-3 ul li a:hover {
color:#4F5F6C;
}


#sidebar #searchform {
margin:0 0 30px 0;
}

#searchform #s {
color: #6F6F6F;
font-size: 12px;
padding: 6px 0 6px 10px;
}

/* #Contact Form 7
================================================== */


#wpcf7-f21-t1-o1 {
position:relative;
}

#wpcf7-f21-t1-o1 input.wpcf7-text {
margin:0 0 5px 0;
}

#wpcf7-f21-t1-o1 input.wpcf7-submit {
margin-top:-30px;
}

#wpcf7-f21-t1-o1 p {
margin:0;
padding:0;
}


div.wpcf7 {
    margin: 0;
    padding: 0;
}
div.wpcf7-response-output {
    margin: 2em 0.5em 1em;
    padding: 0.2em 1em;
}
div.wpcf7-mail-sent-ok {
    background: url("images/icon-ok.png") no-repeat scroll 0 0 transparent;
    border: medium none;
    bottom: -15px;
    color: #8B8B8A;
    height: 20px;
    left: 80px;
    padding: 0 0 0 25px;
    position: absolute;
    width: 150px;
}
div.wpcf7-mail-sent-ng {
    background: url("images/icon-alert.png") no-repeat scroll 0 0 transparent;
    border: medium none;
    bottom: -15px;
    color: #8B8B8A;
    height: 20px;
    left: 80px;
    padding: 0 0 0 25px;
    position: absolute;
    width: 150px;
}
div.wpcf7-spam-blocked {
    background: url("images/icon-alert.png") no-repeat scroll 0 0 transparent;
    border: medium none;
    bottom: -15px;
    color: #8B8B8A;
    height: 20px;
    left: 80px;
    padding: 0 0 0 25px;
    position: absolute;
    width: 150px;
}
div.wpcf7-validation-errors {
    background: url(images/icon-alert.png) no-repeat;
    border: medium none;
    bottom: -15px;
    height: 20px;
    left: 80px;
    position: absolute;
    width: 80px;
}
span.wpcf7-form-control-wrap {
    position: relative;
}
span.wpcf7-not-valid-tip {
    background: none repeat scroll 0 0 #FDDFDE;    
    font-size: 10pt;    
    padding: 2px;
	height:23px;
    width: 215px;
    z-index: 100;
	padding:5px 0 0 5px;
	display:block;
}

html.ie {
display:nonel
}

span.wpcf7-not-valid-tip-no-ajax {
    color: #FF0000;
    display: block;
    font-size: 10pt;
}
span.wpcf7-list-item {
    margin-left: 0.5em;
}
.wpcf7-display-none {
    display: none;
}
div.wpcf7 img.ajax-loader {
    border: medium none;
    margin-left: 4px;
    vertical-align: middle;
}
div.wpcf7 .watermark {
    color: #888888;
}

/* PageNavi */

.wp-pagenavi {
    clear: both;
   padding:30px 0 40px 10px;
}

.wp-pagenavi .pages {
   border:none;
   color:#ccc;
   background:none;
}
.wp-pagenavi a, .wp-pagenavi span {
 border: 1px solid #d9d9d9;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px; 
behavior: url(style/PIE.htc);
margin: 2px;
padding: 5px 10px;
text-decoration: none;
	background:#d9d9d9;
}
.wp-pagenavi a:hover, .wp-pagenavi span.current {    
background:#4f5f6c;
color:#fff;
 border: 1px solid #4F5F6C;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px; 
behavior: url(style/PIE.htc);
}
.wp-pagenavi span.current {
    font-weight: bold;
}

/* Socialize */

.socialize-containter {
min-height: 70px !important;
}

/* AddThis */

.addthis_default_style {
background: none repeat scroll 0 0 #F9F9F9;
border-top: 1px solid #CCCCCC;
margin: 25px 0 0 10px;
padding: 10px;
}


/* #Media Queries
================================================== */

	/* Smaller than standard 960 (devices and browsers) */
	@media only screen and (max-width: 959px) {
	
#header nav.primary {
float:left;
width:580px;
height:68px;
margin-top:45px;
padding-left:0;
}

.sws-menu li a {
background: url("images/menu-right.png") no-repeat scroll 100% -36px transparent;
color: #d8d9d9;
float: left;
font-size: 11px;
font-weight: bold;
height: 36px;
line-height: 34px;
padding: 0 28px;
text-transform: uppercase;
}
	
	
#flexslider-container {
width:780px !important;
}

#flexslider-container h2 {
font-family:'Open Sans';
font-size:20px;
color:#585a5b;
padding:40px 0 20px 55px;
}


#flexslider-container p {
font-family:Arial, sans-serif;
font-size:16px;
color:#898A8B;
padding:0px 0 20px 55px;
line-height:150%;
margin:0;
}
#flexslider-container a {
color:#909FAD;
text-decoration:none;
}

#flexslider-container .background {
width:340px;
height:334px;
background:url(images/SWS-Slides.jpg) no-repeat;
padding:0;
}

#flexslider-container .websites {
background-position:0 20px;
}
#flexslider-container .eco {
background-position:-338px 20px;
}
#flexslider-container .faq {
background-position:-1028px 20px;
}
#flexslider-container .social {
background-position:-684px 20px;
}


img.service-image {
    border: 5px solid #FFFFFF;
    box-shadow: 0 2px 3px 2px rgba(0, 0, 0, 0.1);
	width:201px;
	height:60px;
}

.services-blocks h2 {
    color: #4F5F6C;
    font-family: 'Open Sans',Arial,sans-serif;
    font-size: 16px;
    font-weight: bold;
}

.services-blocks p {
    color: #8B8B8B;
    font-size: 14px;
    padding-top: 15px;
}

#main-block {
    width: 780px;
	height:280px;
}
.services-blocks a.button {
    font-size: 16px;
    width: 200px;
}

.quote {
    width: 235px;
}
	
}

	/* Tablet Portrait size to standard 960 (devices and browsers) */
	@media only screen and (min-width: 768px) and (max-width: 959px) {
	
	#header #sws-logo {		
		padding-left:30px;
		}
	
	}

	/* All Mobile Sizes (devices and browser) */
	@media only screen and (max-width: 767px) {
	
		#header nav.primary {
		display:none;
		}
		
		#header {
		width:300px !important;
		position:relative;
		background:#4F5F6C !important;
		}
		
		#header #sws-logo {				
		position:absolute;
		left:20%;
		}
		
		#flexslider-container {
		display:none;
		}
		
		.services-blocks {
		width:250px !important;
		height:900px !important;
		}
		
		.services-blocks h2 {
		padding-top:15px !important;	
		
		}
		
		.services-blocks p {
		padding-right:5px;	
		}
		
				
		#bottom-blocks .about-front p {
		width:250px !important;
		}
		
		#bottom-blocks .testimonials-front {
		display:none;
		}
		
		#bottom-blocks .contact-front h2{
		margin:20px 0 0 0 ;
		}
		
		span.wpcf7-form-control-wrap input.wpcf7-text{
		width:200px;
		}
		
		span.wpcf7-form-control-wrap textarea.wpcf7-use-title-as-watermark{
		width:200px;
		}
		
		#footer {
		display:none;
		}
			
	
	}

	/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
	@media only screen and (min-width: 480px) and (max-width: 767px) {
	
	#header nav.primary {
		display:none;
		}
		
		#header {
		width:420px !important;
		position:relative;
		background:#4F5F6C !important;
		}
		
		#header #sws-logo {				
		position:absolute;
		left:30%;
		}
		
		#flexslider-container {
		display:none;
		}
		
		.services-blocks {
		width:420px !important;
		height:950px !important;
		}
		
		.services-blocks h2{	
	    text-align:center;
		padding:20px 0 0 0px;	
		}
		
		.services-blocks img.service-image {
		margin-left:100px;
		}
		
		.services-blocks a.button {
		margin-left:100px;
		}
		
		.services-blocks p {
		text-align:center;
		width:250px;
		margin-left:80px;		
		}
		
		#bottom-blocks .about-front p {
		width:400px !important;
		}
		
		#bottom-blocks .testimonials-front {
		display:none;
		}
		
		#bottom-blocks .contact-front h2{
		margin:20px 0 0 0 ;
		}
		
		span.wpcf7-form-control-wrap input.wpcf7-text{
		width:350px;
		}
		
		span.wpcf7-form-control-wrap textarea.wpcf7-use-title-as-watermark{
		width:350px;
		}
		
		#footer {
		display:none;
		}
	
	
	}

	/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
	@media only screen and (max-width: 479px) {}


/* #Font-Face
================================================== */
/* 	This is the proper syntax for an @font-face file
		Just create a "fonts" folder at the root,
		copy your FontName into code below and remove
		comment brackets */

/*	@font-face {
	    font-family: 'FontName';
	    src: url('../fonts/FontName.eot');
	    src: url('../fonts/FontName.eot?iefix') format('eot'),
	         url('../fonts/FontName.woff') format('woff'),
	         url('../fonts/FontName.ttf') format('truetype'),
	         url('../fonts/FontName.svg#webfontZam02nTh') format('svg');
	    font-weight: normal;
	    font-style: normal; }
*/