@import "/styles/reset.css";
@import "/styles/skeleton.css";
@import "/styles/superfish.css";
@import "/styles/flexslider.css";
@import "/styles/twitter.css";
@import "/styles/ui.totop.css";
@import url(http://fonts.googleapis.com/css?family=PT+Sans);


article,aside,audio,canvas,command,datalist,details,embed,figcaption,figure,footer,header,hgroup,keygen,meter,nav,output,progress,section,source,video{display:block}mark,rp,rt,ruby,summary,time{display:inline}
/* Global properties ======================================================== */
html {width:100%}

body {font-family:Arial, Helvetica, sans-serif; font-size:13px; line-height:18px; color:#4B4545; min-width:960px; background:#dcdcdc; -webkit-text-size-adjust: none;}

.main_bg{background:url(/images/body_bg.jpg) 50% 0 repeat #f3f3f3; width:100%}

/*********************************fonts*************************************/
.reg {text-transform:uppercase}
.f_left {float:left}
.f_right {float:right}
.align_right {text-align:right}
.align_center {text-align:center}

.it{font-style:italic}
.let{letter-spacing:-1px}

/*********************************CLASSES**********************************/
.m_bottom_zero{ margin-bottom:0 !important;}
.m_left_zero{ margin-left:0 !important;}
.p_bottom_zero{ padding-bottom:0 !important;}
.p_left_zero{ padding-left:0 !important;}

.clear {clear:both;width:100%;line-height:0;font-size:0;}
.wrapper {width:100%;overflow:hidden}
.extra_wrapper{ overflow:hidden;}
.container{width:100%}
.extra_last, .last{ margin-bottom:0 !important; padding-bottom:0 !important;}
.extra_last{ border:none !important; background:none !important;}
.bg_none{ background:none !important;}

/*==================================== Links ======================================================== */
a {color:#737373;;outline:none; text-decoration:none; cursor:pointer;}
a:hover{ color:#0000FF; text-decoration:none;}

.button {
    background: url("/images/button.png") repeat-x scroll 0 0 rgba(0, 0, 0, 0);
    color: #FFFFFF;
    display: block;
    font-size: 16px;
    height: 46px;
    line-height: 22px;
    margin: 0 26px 0 0;
    padding-left: 10px;
    position: relative;
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.21);
    vertical-align: middle;
}
.button:hover, .button:hover:after{ background-position: 0 100%;color: #fff;}
.button:after{display: block;position: absolute;width: 26px;height: 46px;background: url('/images/button_after.png') no-repeat;right: -26px;top: 0;content: "";}

.button1{ display:inline-block; padding:8px 12px; margin: 5px 0 0; font-size: 12px; line-height: 16px; color:#fff; text-shadow: 0 -1px 0 rgba(0,0,0,0.15); background: #0000FF;}
.button1:hover{ background:#CCCCCC; color:#0000FF;}
a.button7{ display:block;float:right; padding:8px 12px; margin:0; font-size: 12px; line-height: 16px; color:#fff; text-shadow: 0 -1px 0 rgba(0,0,0,0.15); background: #0000FF;}
a.button7:hover{ background:#CCCCCC; color:#0000FF;}
.button2{background: url('/images/button2.png') repeat-x #0000FF;font-size: 16px; line-height: 22px; color: #fff; text-transform: uppercase; text-shadow: 0 -1px 1px rgba(0,0,0,0.24);padding: 21px 16px 23px;margin: 0 0 0 38px;display: inline-block;}
.button2:hover{background: #CCCCCC;color: #0000FF;}

/*********************************Displays*************************************/
.block{ display:block;}
.inline-block{ display:inline-block;}

/*********************************header*************************************/

header {padding: 10px 0 11px}
header h1{width: 195px;height: 73px;margin: 0 auto;}
header h1 a {display:block;width:195px;height:73px;background:url(/images/logo.png) 0 0 no-repeat; text-decoration:none; text-indent:-9999px;}

/*********************************content*************************************/
//#content {padding:27px 0px 46px;}
//.cont_pad{padding:28px 0 46px !important;}

/*===============================>> Paragraphs <<=============================*/

p {text-align:justify;//margin-bottom:18px}
.p2{ margin-bottom:14px;}
.p3{ margin-bottom:40px;}

/*================================>> LISTS <<========================================*/
.list1,ul.child li,.sf-menu li{list-style: none;}
.list1 li.top{ background:url(/images/marker1.png) 2px 0px no-repeat;padding: 0 0 5px 33px;}
//.list1 li{margin-left:20px;}
.list1 li.top a{font-size: 13px;color: #4B4545;}

/*================================>> H <<========================================*/
h2,h3,h4{ font-weight:normal;}
h2{font-size: 32px; line-height: 39px; color:#4b4545;}

h2.ind{ margin-bottom:12px;margin-top: 10px;}

h3{font-size: 28px; line-height: 24px; color:#4b4545;}
h3.ind{ margin-bottom:13px;}
h3.ind1{margin-bottom: 20px;text-align: center;color: #0000FF;}

h4{font-size: 24px; line-height: 24px; color: #4b4545;}
h4.ind{margin-bottom: 33px;}
h4.ind4{/*height: 55px;*/ font-size:18px}
h4.ind1{margin-bottom: 15px;}

h5{font-size: 16px; line-height: 21px; color: #4b4545; margin-bottom: 2px;}
/*================================>> GOOGLE FONTS  <<========================================*/

.sf-menu>li>a, h2, h3, h4,.button, .link1, .join, h5{font-family: 'PT Sans', sans-serif;}

/*================================>> hovers <<========================================*/
.sf-menu>li a em, .button1, .img_wrap1,.img_wrap2, .link2{-webkit-transition: all 0.5s ease;-moz-transition: all 0.5s ease;-o-transition: all 0.5s ease;transition: all 0.5s ease;}

/*********************************page_1*************************************/
.ext_list>li, .ext_box{ overflow:hidden;}
.ext_list>li>figure, .ext_box>figure{ float:left;}
.ext_list>li>div, .ext_box>div{//overflow:hidden; }

.project{padding: 0 0px 0 0;}

.m_bot1{margin-bottom: 24px;}
.m_bot2{margin-bottom: 42px;}
.m_bot3{margin-bottom: 29px;}

.link1{font-size: 18px; line-height: 22px; color: #333333; text-transform: uppercase; display: inline-block;padding-right: 12px;background: url('/images/link1_marker.png') right 8px no-repeat;}

.link2{color: #3b3b3b;font-size: 13px;font-weight: bold;}

.link2:hover, .link1:hover{color: #ff4b1b;}


.button_wrap{padding-top: 19px;margin-bottom: 40px;position: relative;}
.button_wrap .stripe_after{position: absolute;right: 0;bottom: 3px;height: 1px;background: #cfcece;}

.img_wrap1{padding: 5px;background: #dfdddd;display: inline-block;}
a.img_wrap1:hover{background: #0000FF;}
.img_wrap2{padding: 5px;background: #dfdddd;display: inline-block;}
a.img_wrap2:hover{background: #0000FF;}

.welcome>div{padding-top: 5px;}
.welcome>figure{margin: 0 20px 0 0;}

.pad_box{padding-right: 40px;}

.join{padding: 6px;background: url('/images/pattern1.jpg') repeat;font-size: 26px; line-height: 32px; color: #fff; text-transform: uppercase; text-shadow: 0 -1px 1px rgba(0,0,0,0.24); text-align: center;}
.join .inner{background: url('/images/pattern2.jpg') repeat;padding:  14px 0 12px;}
.join .inner span{display: inline-block;padding-top: 15px;    font-size: 24px;}

/*================================>> FLICKR <<========================================*/
.flickr_badge_image{float: left;margin: 0 0 15px 15px;}
.flickr_badge_image a{display: inline-block;border: 1px solid #ebebeb;}
.flickr_badge_image a:hover{border-color: #ff4a1a;}
.flickr_badge_image img{width: 88px;height: 88px;}

#flickr_badge_image1, #flickr_badge_image4{margin-left: 0;}

.social_list a{color: #6e6e6e;font-size: 12px;display: inline-block;}
.social_list li{margin-bottom: 16px;}
.social_list span{display: inline-block;padding-top: 10px;margin-left: 9px;}
.social_list a:hover{color: #000;}

.black{font-size: 13px; color: #3b3b3b;}
.black2 a{font-size: 13px; color: #000;text-decoration: none;}
/*********************************page_2*************************************/
.about{margin-bottom: 42px;}
.about>div{padding: 5px 30px 0 0;}
.about>figure{margin: 0 20px 0 1px;}
a.logo{
    color:#0000FF;
    font-weight: bold;
    font-family: 'PT Sans',Arial;
    display:block;
    float:left;
    width:390px;   
}
a.logo p{
      font-size: 52px;
    line-height: 40px;
}
a.logo span{
     font-size: 48px;
    line-height: 20px;
}
.prof{width: 135px;margin-left: 20px;float: left;}
.prof .img_wrap1{margin-bottom: 16px;}
.prof_box .prof:first-child{margin-left: 0;}

.offer_list{margin-bottom: 38px;}
.offer_list>li{margin-bottom: 21px;}
span#dat{
    display:block;
    color:#000;
}
.testimonials{padding-top: 1px;}
.testimonials>li{margin-bottom: 22px;}
.testimonials>li>blockquote:before{margin-right: 6px;width: 14px;display: inline-block;height: 9px;background: url('/images/quote.png') no-repeat;content: "";}
.testimonials .author{text-align: right;}
/*********************************page_3*************************************/
.service{padding-right: 40px;margin-bottom: 16px;}
.service>div{padding-top: 5px;}
.service>figure{margin: 0 20px 0 0;}

.services2{margin-bottom: 39px;}
div#product1{
    //padding-left: 10px;
    width: 700px;
}
.services1{}
.services1 .col1{width: 300px;}
.services1 .col2{width: 300px;margin-left: 70px;}
.services1>div{float: left;}


.service1{margin-bottom: 29px;}
.service1>div{}
.service1>figure{width: 117px;margin: 0 0 0 0;}
.service1 h5{margin-bottom: 3px; white-space: nowrap;}

.client{}
.client .img_wrap1{margin-bottom: 18px;}
.client .img_wrap2{margin-bottom: 5px;}
/*********************************page_4*************************************/
.blog_list>li{padding: 0 30px 0 1px;margin-bottom: 38px;}
//.blog_list>li>div{padding-top: 5px;}
.blog_list>li>figure{margin: 0 21px 0 0;}
.blog_list .info{font-size: 11px; line-height: 14px; margin-bottom: 10px;}
.blog_list .info, .blog_list .info a{color: #ff4a1a;}
.blog_list .info a:hover{color: #010101;}
.blog_list .title{margin-bottom: 3px;}

.categories_list{margin-bottom: 39px;}
/*********************************page_5*************************************/

.quantity_box_button_down {
    background: url("/images/arrows.gif") no-repeat scroll -21px 0 rgba(0, 0, 0, 0);
    border: medium none;
    font-size: 12px;
    height: 19px;
    vertical-align: middle;
    width: 19px !important;
}
.quantity_box_button_up {
    background: url("/images/arrows.gif") no-repeat scroll 0 0 rgba(0, 0, 0, 0);
    border: medium none;
    font-size: 12px;
    height: 19px;
    vertical-align: middle;
    width: 19px !important;
}
/* Contact form */
#contact-form {padding:0px 0 0 0;}
#contact-form .success {width:246px;  padding:10px;}
#contact-form textarea, #contact-form input {margin:0;font-size:13px; border:1px solid #cac4c4; color:#958d8d; padding:12px 12px;outline:none; position:relative; font-family:Arial, Helvetica, sans-serif;background:none;}
#contact-form input {width:353px;}
#contact-form textarea {overflow:auto; width:514px; height:157px;resize:none; float:left; margin: 0 0 0 0;}	
#contact-form label {display:block; min-height:57px; overflow:hidden;}	
#contact-form label.message { display:block; padding-bottom:0; }
#contact-form .button1 {margin-left:26px;}	
#contact-form .error, #contact-form .empty, #contact-form .success {display:none;}	
#contact-form .error, #contact-form .empty {text-align:left; color:red; font-size:11px; clear:both;}
#contact-form .buttons2 {overflow:hidden;text-align:right; position:relative; clear:both; padding-top:28px;}
#contact-form .buttons2 a {
	cursor:pointer;
	margin-top:0;
	text-align:center;
}
#contact-form span{ display:block; margin: 0px 0 0 5px;}

.map_wrapper{overflow:hidden;display:inline-block;margin-bottom:18px;}
#map_canvas {
   width:346px;
   height:247px;
}
.adress{}
.adress span{ display:inline-block; width:90px;}
.adress dt{}

.demo{}
.demo:hover{ text-decoration:underline;}
/****************************footer************************/
aside{padding: 49px 0 9px;}

//footer {padding:22px 0 0px;}
footer .social{ overflow:hidden;}
footer .social a{ display:block; float:left;width:32px;height:32px; overflow:hidden; margin-left:8px;}
footer .social a:first-child{margin: 0 0 0 0;}
footer .social a:hover img{ margin-top:-32px;}

.footer{padding: 23px 0;font-size: 11px;text-transform: uppercase;//background: url('/images/footer_stripe.jpg') repeat-x;
}
.footer, .footer a{color: #0000FF;}
.footer a:hover{color: #000;}
footer span.phone{color: #585858;}
.footer p{float:right};
/*==================================RESPONSIVE LAYOUTS===============================================*/
@media only screen and (max-width: 995px) {
 body{min-width:768px;}
 .flexslider{height: 355px;}
 .welcome>div{overflow: visible;}
 .prof img, .project img, .client img{width: 100%;}
 .project figure{display: block;padding-right: 24px;}
 .button2{margin-top: 15px;margin-left: 0;}
 #flickr_badge_image1, #flickr_badge_image3, #flickr_badge_image5{margin-left: 0;}
 #flickr_badge_image4{margin-left: 15px;}
 .social_list span{margin-left: 2px;}
 .about>div, .service>div{overflow: visible;}
 .prof{margin-left: 10px;width: 115px;}
 .services1 .col2{margin-left: 20px;}
 .services1 .col1{width: 250px;}
 .services1 .col2{width: 250px;}
 .blog_list>li>div{overflow: visible;}
 #map_canvas{width: 100%;}
 #contact-form textarea, #contact-form input{width: 400px;}
}

@media only screen and (max-width: 767px) {
 body{min-width:420px;}
 .flexslider{height: 199px;}
 #flickr_badge_image3{margin-left: 15px;}
 header{padding-bottom: 25px;}
 .about>figure, .service>figure{float: none;margin: 0 0 15px 0;}
 .img_wrap1{display: block;}
 .img_wrap1 img{width: 100%;}
 .img_wrap2{display: block;}
 .img_wrap2 img{width: 100%;}
 .prof{width: 100%;margin: 0 0 20px 0;float: none;}
 .services1>div{float: none;width: 100% !important;margin: 0 0 20px !important;}
 .service{padding-right: 0;}
 .blog_list>li{padding-right: 0;}
 .blog_list>li>figure{float: none;margin:0 0 15px 0;}
  #contact-form textarea, #contact-form input{width: 394px;}
 
}

@media only screen and (max-width: 479px) {
 body{min-width:300px;}
 .flexslider{height: 142px;}
 #flickr_badge_image4{margin-left: 0px;}
 #flickr_badge_image5{margin-left: 15px;}
 #contact-form textarea, #contact-form input{width: 273px;}
}
p.logo{
    color:#0000FF;
    font-size:58px;
    font-weight: bold;
    font-family: 'PT Sans',Arial;
    display:block;
    float:left;
    width:390px;
    padding-top: 30px;
}
div.cont{
    display:block;
    float:left;
    width:250px;
}
div.cont p{
    color:#4B4545;
    font-size:28px;
    line-height: 36px;
    font-family: 'PT Sans', sans-serif;
    padding-left: 30px;
    margin:0;
}
div.search{
    display:block;
    float:right;
    width:270px;
    margin-right: 8px;
}
div#breadcrumbs{
    margin:10px;
}
.headcell{
    display:block;
    width:940px;
    height:70px;
}
p.phone{
    background: url('/images/pnone.png') no-repeat;
}
p.skype{
    background: url('/images/skype.png') 0px 4px no-repeat;   
}
.search .input-search {
    //-moz-box-sizing: border-box;
    background: none repeat scroll 0 0 #3399FF;
    border: 1px solid #BAB9B9;
    border-radius: 0;
    color: #FFFFFF;
    float: left;
    font-size: 13px;
    font-style: italic;
    height: 22px;
    line-height: 20px;
    padding-left: 5px;
    width: 270px;
}
.search form{
        padding-top: 5px;
}
.search .input-search:hover{
     color: #FFF;
     font-style:normal;
}
.search #submit {
    //-moz-box-sizing: content-box;
    background: url("/images/search.png") no-repeat scroll center 5px rgba(0, 0, 0, 0);
    border: medium none;
    box-shadow: none;
    cursor: pointer;
    height: 32px;
    margin-left: -25px;
    overflow: hidden;
    padding: 0 8px;
    text-indent: -1000px;
    transition: none 0s ease 0s;
    width: 8px;
}
ul.child li{
    margin-left:30px;
    padding-bottom: 5px;
}
img.stars{
    margin-top:10px;
}
#contact-form input.button4{
    cursor: pointer;
    text-align: center;
    background: url('/images/button2.png') repeat-x #0000FF;
    font-size: 16px;
    line-height: 20px;
    color: #fff;
    font-family: 'PT Sans', sans-serif;
    //text-transform: uppercase; 
    text-shadow: 0 -1px 1px rgba(0,0,0,0.24);
    display:inline-block;
    width:100px;
    float:right;
}
p.art{
    height: 119px;
    overflow:hidden;
}
p.nws{
    height: 67px;
    overflow:hidden;
}
p.itm{
    height: 54px;
    overflow:hidden;
}
a.page{
    background: none repeat scroll 0 0 #0000FF;
    color: #FFFFFF;
    padding: 5px 7px;
}
span.current{
    background: none repeat scroll 0 0 #CCC;
    color: #0000FF;
    padding: 5px 7px;
}
div.navigation{
    text-align: center;
    padding-bottom: 15px;
}
span.price{
    background: none repeat scroll 0 0 #FFF;
    color: #0000FF;
    display: inline-block;
    font-size: 12px;
    line-height: 16px;
    margin: 5px 0 0;
    padding: 6px 12px;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15);
    //text-transform: uppercase;
    border:2px solid #0000FF;
}
span.price1{
    background: none repeat scroll 0 0 #FFF;
    color: #0000FF;
    display: inline-block;
    font-size: 12px;
    line-height: 16px;
    margin: 0;
    padding: 6px 12px;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15);
    //text-transform: uppercase;
    border:2px solid #0000FF;
    display:block;
    float:right;
}
span.noprice{
    background: none repeat scroll 0 0 #FFF;
    color: #BF0000;
    display: inline-block;
    font-size: 12px;
    line-height: 16px;
    margin: 5px 0 0;
    padding: 6px 12px;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15);
    text-transform: uppercase;
    border:2px solid #BF0000;
}
span.noprice1{
    background: none repeat scroll 0 0 #FFF;
    color: #BF0000;
    display: inline-block;
    font-size: 12px;
    line-height: 16px;
    margin: 5px 0 0;
    padding: 6px 12px;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15);
    text-transform: uppercase;
    border:2px solid #BF0000;
    float:right;
}
form#login-form{
    width:500px;
    height:500px;
}
form.popup{
    width:400px;
    height:400px;
    padding:20px;
    background: #F6F6F6;
}
form.popup span {
    display: block;
    padding: 5px;
    width: 100%;
}
form.popup label {
    display: block;
    padding: 5px;
    width: 110px;
    float:left;
}
form.popup input[type="text"] {
    display: block;
    float: left;
    padding: 5px;
    width: 260px;
}
form.popup input[type="submit"] {
    display: block;
    float: right;
    margin-right: 5px;
}
form.popup textarea {
    display: block;
    float: left;
    padding: 5px;
    width: 260px;
    height:60px;
}
a.vk{
    background: url("/images/b-share-icon.png") no-repeat scroll 0 99px rgba(0, 0, 0, 0);
    background-position: 0 0;
    width:20px;
    height:17px;
    display:block;
    float:right;
}
a.fb{
    background: url("/images/b-share-icon.png") no-repeat scroll 0 99px rgba(0, 0, 0, 0);
    background-position: 0 -68px;
    width:20px;
    height:17px;
    display:block;
    float:right;
}
a.tw{
    background: url("/images/b-share-icon.png") no-repeat scroll 0 99px rgba(0, 0, 0, 0);
    background-position: 0 -51px;
    width:20px;
    height:17px;
    display:block;
    float:right;
}