/*
 * MAIN
 *
 * Made 2012 Rashid Shamsudinov (rash2x).
 * www.rash2x.ru
 */

#support {
    height: 77px;
    position: fixed;
    right:0;
    top:50%;
    width:100%;
    z-index: 12;
}
#support.autor {
}
#support.show {
    z-index: 20;
    width:300px;
}
    .support-outer {
        position: absolute;
        width: 100%;
        right:-262px;
    }
        .support-open {
            position: relative;
            z-index: 3;
            background: #ff0350;
            width: 28px;
        }
            .support-open a {
                display: block;
                height: 77px;
                
                line-height: 77px;
                text-align: center;
            }
            .support-open a:hover {
                background: #ff0350;
                background: -moz-linear-gradient(left,  #ff0350 0%, #d30442 100%);
                background: -webkit-gradient(linear, left top, right top, color-stop(0%,#ff0350), color-stop(100%,#d30442));
                background: -webkit-linear-gradient(left,  #ff0350 0%,#d30442 100%);
                background: -o-linear-gradient(left,  #ff0350 0%,#d30442 100%);
                background: -ms-linear-gradient(left,  #ff0350 0%,#d30442 100%);
                background: linear-gradient(to right,  #ff0350 0%,#d30442 100%);
                filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff0350', endColorstr='#d30442',GradientType=1 );
            }
            .support-open a:active {
                background: #B70336;
                box-shadow: inset 0 0 3px rgba(0,0,0,0.5);
            }
        .support-wrap {
            position: relative;
            background: url(/images/support-bg.png) no-repeat;
            height: 77px;
            width: 262px;
            
            -webkit-box-shadow: 0 5px 24px #0e1c22;
               -moz-box-shadow: 0 5px 24px #0e1c22;
                    box-shadow: 0 5px 24px #0e1c22;
        }
            .support-title {
                height: 22px;
                margin: 12px 0 0 20px;
                
                white-space: nowrap;
                line-height: 22px;
                font-weight: 400;
                font-size: 13px;
                text-transform: uppercase;
                color: #ffffff;
            }
            .support-link {
                margin: 8px 0 0 20px;
            }
@media (max-width: 1053px) {
    #support {
        position: absolute;
        top:390px;
        overflow: hidden;
    }
}
#wrapper {
	width:996px;
	margin: 0 auto;
	position: relative;
	z-index: 13;
}
    /* ------------ 
     * HEADER
     */
    #header {
        overflow: hidden;
        height: 456px;
    }
        #logo {
            width: 328px;
            position: relative;
        }
            #logo a {
                position: relative;
                z-index: 4;
                background: url(/images/logo.png) no-repeat;
                width: 210px;
                height: 77px;
                margin: 24px 0 0 82px;
                overflow: visible;
                top:4px;
            }
            #logo a:before {
                background: url(/images/sep.gif) no-repeat;
                display: block;
                content: "";
                width:11px;
                height: 2px;
                position: absolute;
                bottom:23px;
                left:-34px;
                pointer-events:none;
            }
            #logo .storm {
            	position: absolute;
            	z-index: 3;
            	background: url(/images/logo-storm.png) no-repeat;
            	width: 66px;
            	height: 77px;
            	top: -100px;
            	left: 200px;
            	opacity: 0;
            }
        #navi {
            width: 668px;
            height: 105px;
            position: relative;
            left: 64px;
        }
            #navi .navi-bg {
                position: absolute;
                z-index: 2;
                width: 177px;
            }
            	#navi .navi-bg .navi-bg-center {
            		width: 95px;	
            	}
            #navi.services .navi-bg {
            	left:127px;
            	width: 167px;
            }
            	#navi.services .navi-bg .navi-bg-center {
            		width: 85px;
            	}
            #navi.about .navi-bg {
            	left:244px;
            	width: 189px;
            }
            	#navi.about .navi-bg .navi-bg-center {
            		width: 107px;
            	}
                #navi .navi-bg .navi-bg-left,
                #navi .navi-bg .navi-bg-right,
                #navi .navi-bg .navi-bg-center {
                    height: 115px;
                }
                #navi .navi-bg .navi-bg-left {
                    background: url(/images/navi-bg-left.png) no-repeat;
                    width: 14px;
                }
                #navi .navi-bg .navi-bg-center {
                    background: url(/images/navi-bg-center.png) repeat-x;
                    min-width: 20px;
                }
                #navi .navi-bg .navi-bg-right {
                    background: url(/images/navi-bg-right.png) no-repeat;
                    width: 23px;
                }
            #navi ul {
                position: relative;
                z-index: 3;
            }
                #navi ul li.main a {
                    width:57px;
                }
                #navi ul li.services a {
                    width:47px;
                }
                #navi ul li.about a {
                    width:69px;
                }
                #navi ul li.support a {
                    width:78px;
                }
                #navi ul li.login a {
                    width:157px;
                }
                #navi ul li a {
                    padding: 75px 35px 7px 35px;
                    display: block;
                    height: 23px;
                    
                    letter-spacing: 1px;
                    color:#e4f6ff;
                    font:700 11px "Din Display Cyrillic Bold", Arial, Helvetica, sans-serif;
                    line-height: 23px;
                    text-transform: uppercase;
                    text-decoration: none;
                    text-shadow:0 -1px 0 #000;
                }
                        #navi ul li a .icon-login {
                            top:-2px;
                        }
                        #navi ul li a:hover .icon-hover.icon-login,
                        #navi ul li.active .icon-hover.icon-login {
                            background-position: center bottom;
                        }
                    #navi ul li a:hover,
                    #navi ul li.active a {
                        color: #181f25;
                        text-shadow:0 1px 0 #b8ddff, 0 0 5px #afc7d4;
                    }
        #sub-navi {
            background: #131c1f;
            height: 30px;
            margin: 0 0 0 45px;
            position: relative;
            padding: 0 0 0 14px;
        }
        #sub-navi:before {
            background: url(/images/sub-navi.png) no-repeat;
            content: "";
            width: 44px;
            height: 30px;
            position: absolute;
            top:0;
            left:-44px;
        }
            #sub-navi ul li {
                position: relative;
            }
            #sub-navi ul li:before {
                background: url(/images/sep.png) no-repeat;
                content: "";
                width:1px;
                height: 8px;
                position: absolute;
                top:0;
                left:0;
            }
             #sub-navi ul li:first-child:before {
                 background: none;
             }
                #sub-navi ul li a {
                    display: block;
                    height: 30px;
                    padding: 0 26px;
                    
                    color: #6d7279;
                    font:10px/30px "Din Display Cyrillic Medium", Arial, Helvetica, sans-serif;
                    text-transform: uppercase;
                    text-decoration: none;
                }
                    #sub-navi ul li a:hover {
                        color: #ccd8db;
                    }
                    #sub-navi ul li.active a {
                        color: #e1f9ff;
                        font:10px/30px "Din Display Cyrillic Bold", Arial, Helvetica, sans-serif;
                   }
        #slider {
            height: 364px;
            position: relative;
        }
            .slider-wrap {
                height: 240px;
                position: relative;
                z-index: 14;
            }
                .slider-item {
                    width:100%;
                    position: absolute;
                    top:0;
                    left:0;
                    z-index: 2;
                    display: none;
                }
                .slider-item.show {
                    display: block;
                    z-index: 3;
                }
                    .slider-bg {
                        height: 138px; 
                        position: relative;
                        z-index: 2;
                        padding: 97px 0 0 70px;
                        background-repeat: no-repeat;
                        border:1px solid #45555f;
                        border-bottom:3px solid #ff0350;
                    }
                        .slider-title {
                             position: relative;
                         }
                            .slider-title h2 {
                                color: #fff;
                                font:30px "Din Display Cyrillic Light", Arial, Helvetica, sans-serif;
                            }
                                .slider-title h2 span {
                                    line-height: 36px;
                                }
                                    .slider-title h2 span b {
                                        font-weight: 500;
                                        font:30px "Din Display Cyrillic Medium", Arial, Helvetica, sans-serif;
                                    }
                        .slider-more {
                            margin: 16px 0 0 6px;
                            position: relative;
                        }
                    .slider-image {
                         position: absolute;
                         z-index: 3;
                         width:200px;
                         margin: 0 auto;
                         text-align: center;
                         left:53%;
                         bottom:-68px;
                    }
            .slider-pager {
                position: absolute;
                z-index: 16;
                bottom:134px;
                right:10px;
            }
                .slider-pager ul li {
                    margin: 0 0 0 2px
                }
                    .slider-pager ul li a {
                        width:12px;
                        height: 12px;
                        background: url(/images/pin.png) no-repeat center;
                        opacity: 0.5;
                        filter: alpha(opacity=50);
                    }
                    .slider-pager ul li.active a {
                        background: url(/images/pin-a.png) no-repeat center;
                        opacity: 1;
                        filter: alpha(opacity=100);
                    }
    /* ------------ 
    * MIDDLE
    */
    #middle {
       position: relative;
    }
    	#content {
    		margin: 20px 0 0;
    	}
        	#content .scroll {
        		height: 353px;
        		margin: 52px 0 0;
        	}
            .server-item {
                width: 184px;
                height: 321px;
                margin: 0 0 0 32px;
                padding: 30px 0 0 40px;
            }
                .server-title {
                    height: 35px;
                    position: relative;
                }
                    .server-title a {
                        background: #152128;
                        padding: 4px;
                        
                        color: #fff;
                        text-decoration: none;
                        text-transform: uppercase;
                    }
                    .server-title:before {
                        background: url(/images/sep.gif) no-repeat;
                        display: block;
                        content: "";
                        width:11px;
                        height: 2px;
                        position: absolute;
                        bottom:20px;
                        left:-24px;
                        pointer-events:none;
                    }
                .server-info {
                    color: #d5ecff;
                    height: 172px;
                }
                    .server-info ul li {
                        margin: 3px 0 0;
                        width:176px;
                        height: 14px;
                        overflow: hidden;
                        text-overflow: ellipsis;
                        white-space: nowrap;
                    }
                    .server-info .free-install {
                    	color: #fff;
                    	font-weight: 700;
                    }
                .server-price {
                    margin: 6px 0 0;
                }
                    .server-price span {
                        font:27px 'Din Display Cyrillic Regular', Arial, Helvetica, sans-serif;
                        color: #fff;
                        margin: 0 2px 0 0;
                    }
                .server-select {
                    margin: 10px 0 0;
                }
            .server-item:first-child {
                margin: 0;
            }
        #defences {
            margin: 60px 0 0;
        }
        #services {
            overflow: auto;
            height: 522px;
            width:996px;
        }
            .service-tr {
                margin: 0 0 0 12px;
                width:492px;
            }
            .service-tr:first-child {
                margin: 0;
            }
            .service-item {
                width: 492px;
                height: 196px;
                margin: 50px 0 0;
            }
                .service-image {
                    width:190px;
                    line-height: 196px;
                    text-align: center;
                }
                .service-info {
                    margin: 0 0 0 190px; 
                    padding: 30px 0 0;
                }
                    .service-title {
                        display: inline;
                        display: inline-block;
                        zoom: 1;
                        margin: 0 0 24px 0;
                        border-bottom: 2px solid;
                        max-width: 290px;
                        
                        font:21px/16px "Din Display Cyrillic Light", Arial, Helvetica, sans-serif;
                        color: #00fcff;
                        text-transform: uppercase;
                        overflow: hidden;
                        text-overflow: ellipsis;
                        height: 18px;
                        white-space: nowrap;
                    }
                    .service-text {
                        width: 290px;
                    }
                        .service-text p {
                            margin: 0;
                            height: 50px;
                            overflow: hidden;
                            line-height: 16px;
                            font-size: 13px;
                        }
                    .service-link {
                        margin: 20px 0 0;
                    }
        #partners {
            height: 150px;
            margin: 83px 0 0;
            outline: none;
        }
            .reviews {
                font-size:11px;
            }
            #partners ul {
            	height: 100px;
            }
            #partners ul li {
                  margin: 0 0 0 10px;
                  width: 150px;
            }
            #partners ul li:first-child {
                margin: 0;
            }
                #partners ul li a {
                    display: inline-block;
                    /* height: 66px; */
                    line-height: 66px;
                }
        #benefits {
        	margin: 65px 0;	
        }
        	.benefits-item {
        		background-repeat: no-repeat;
        		background-position: 35px 0;
        		margin: 30px 0 0;
        		padding: 0 0 0 84px;
        		color: #afc7db;
        	}
	        	.benefits-item h4 {
	        		margin: 0 0 20px 0;
	        	}
	        	.benefits-item > p {
	        	    margin: 0 0 20px 0;
	        	    font:12px/17px 'Din Display Cyrillic Regular', Arial, Helvetica, sans-serif;
	        	}
	        	.benefits-item > p:last-child {
	        		margin: 0;
	        	}
	        	  .benefits-item > p > span {
	        	      color: #e0faff;
	        	  }
	        	.benefits-item > ol {
	        	    margin: 0 0 20px 0;
	        	}
    	#mainbar {
    	    width: 594px;
    	    margin: 60px 0 0;
    	}
    	   #ddos .steps-navi,
    	   #cloud .steps-navi {
    	       width:600px;
    	       position: relative;
    	       left:-62px;
    	   }
    	   .steps-wrap.map {
    	       position: relative;
    	       left: -231px;
    	       padding: 230px 0 0;
    	   }
    	   .steps-wrap.mapc {
    	       position: relative;
    	       left: -231px;
    	       padding: 230px 0 0;
    	   }
    	   #cloud .steps-wrap {
    	       height: 490px;
    	       position: relative;
    	   }
    	       .steps-wrap .step {
    	           display: none;
    	       }
        	       #steps-protect .step-image {
        	           position: absolute;
        	           z-index: 2;
        	           top: 86px;
        	           left: 140px;
        	       }
        	       .steps-wrap.map .step-image {
                       position: absolute;
                       z-index: 2;
                       top: 78px;
                       left: 142px;
                   }
        	       .steps-wrap.mapc .step-image {
                       position: absolute;
                       z-index: 2;
                       top: 78px;
                       left: 142px;
                   }
        	       .steps-wrap .popup {
        	           position: absolute;
        	           z-index: 3;
        	       }
            	       #steps-protect #step1 .popup {
            	           width: 266px;
            	           top:40px;
                           left: 360px;
            	       }
            	       #steps-protect #step2 .popup {
                           width: 284px;
                           top:40px;
                           left: 330px;
                       }
                       #steps-protect #step3 .popup {
                           width: 254px;
                           top:40px;
                           left: 300px;
                       }
                       #steps-protect #step4 .popup {
                           width: 250px;
                           top:40px;
                           left: 260px;
                       }
                       #steps-protect #step5 .popup {
                           width: 500px;
                           top:20px;
                           left: 200px;
                       }
                       #steps-ddos #step1 .popup {
                           width: 280px;
                           top:40px;
                           left: 360px;
                       }
                       #steps-ddos #step2 .popup {
                           width: 250px;
                           top:40px;
                           left: 330px;
                       }
                       #steps-ddos #step3 .popup {
                           width: 234px;
                           top:40px;
                           left: 300px;
                       }
                       #steps-ddos #step4 .popup {
                           width: 244px;
                           top:40px;
                           left: 260px;
                       }
                       #steps-ddos #step5 .popup {
                           width: 240px;
                           top:40px;
                           left: 210px;
                       }
                       #steps-ddos #step6 .popup {
                           width: 500px;
                           top:20px;
                           left: 170px;
                       }
                   #cloud #step1,
                   #cloud #step2,
                   #cloud #step3 {
                       top:110px;
                       position: absolute;
                       left:-60px;
                   }
                       #cloud #step1 .popup {
                           top:-26px;
                           left:110px;
                           width:314px;
                       }
                       #cloud #step2 .popup {
                           top:-26px;
                           left:120px;
                           width:274px;
                       }
                       #cloud #step3 .popup {
                           top:-26px;
                           left:-0px;
                           width:540px;
                       }
                   #cloud #step4 {
                       position: absolute;
                       top:80px;
                       left:-60px;
                   }
                        #cloud #step4 .popup {
                            width: 294px;
                            top:-42px;
                            left:110px;
                        }
                    #cloud #step5 {
                        position: absolute;
                        top:160px;
                        left:-76px;
                    }
                        #cloud #step5 .popup {
                            top:-90px;
                            left:120px;
                            width:294px;
                        }
                    #cloud #step6 {
                        position: absolute;
                        top:30px;
                        left:-160px;
                    }
                        #cloud #step6 .popup {
                            width:220px;
                            left:430px;
                            top:50px;
                        }
                    #cloud #step7 {
                        position: absolute;
                        top:180px;
                        left:-70px;
                    }
                        #cloud #step7 .popup {
                            width: 294px;
                            top:-120px;
                            left:120px;
                        }
    	#sidebar {
            width: 352px;
    	    margin: 94px 0 0;
    	}
    	   .tarrif-item {
    	       margin: 0 0 10px 0;
    	       padding: 13px 0 20px 0;
    	   }
               .tarrif-title {
    	           padding: 0 20px 0 32px;
    	           font:21px "Din Display Cyrillic Light", Arial, Helvetica, sans-serif;
    	       }
    	           .tarrif-title span {
                       line-height: 26px;
                   }
                   .tarrif-title b {
                       font-weight: 400;
                   }
    	       .tarrif-about {
    	           padding: 20px 20px 30px 32px;
    	       }
    	           .tarrif-about p {
    	               margin: 0;
    	           }
    	       .tarrif-features {
    	           
    	       }
		       		.tarrif-features .blank {
		       			padding: 8px 0;
		       		}
    	           .tarrif-features th {
    	               width:204px;
    	               padding: 2px 10px 2px 0;
    	               
    	               
    	               font:12px 'Din Display Cyrillic Regular', Arial, Helvetica, sans-serif;
    	               text-align: right;
    	               color: #9fbcd5;
    	               
    	               vertical-align: top;
    	           }
    	           .tarrif-features th.grey {
	    	           	color: #c6d7e5;
	    	       }
    	           		.tarrif-features th.grey span {
    	           			color: #DBECFA;
    	           			font:12px 'Din Display Cyrillic Medium', Arial, Helvetica, sans-serif;
    	           		}
    	           .tarrif-features td {
    	               font:12px 'Din Display Cyrillic Regular', Arial, Helvetica, sans-serif;
    	               color: #dbecfa;
    	               
    	               vertical-align: top;
    	           }
    	               .tarrif-features .blue {
                            color: #00ffea;
                       }
    	               .tarrif-features .grey {
                            color: #DBECFA;
                       }
                            .tarrif-features .meter {
                                position: relative;
                                top:3px;
                            }
                .tarrif-footnote {
                    padding:10px 0 0 32px;
                    width:220px;
                }
                .tarrif-button {
                    padding: 10px 0 0;
                    text-align: center;
                }
                .tarrif-link {
                    display: none;
                }
        #leftbar {
            width: 595px;
        }
        #rightbar {
            width:  360px;
            margin: 0 26px 0 0;
        }
        #contacts {
            margin: 56px 0 0;
        }
            #contacts p {
                font-size: 13px;
                margin: 0 0 40px 0;
            }
            #contacts ul {
                margin: 0 0 0 60px;
            }
                #contacts ul li {
                    margin: 6px 0 0;
                }
                    #contacts ul li a {
                        display: block;
                        height: 46px;
                        width:404px;
                        
                        text-decoration: none;
                    }
                        #contacts ul li a .contacts-image {
                            display: inline-block;
                            *display:inline;
                            zoom:1;
                            width:120px;
                            text-align: center;
                            line-height: 46px;
                            opacity: 0.5;
                            filter: alpha(opacity=50);
                        }
                        #contacts ul li a .contacts-text {
                            color: #deefff;
                            font-size: 17px;
                            font-weight: 100;
                        }
                        #contacts ul li a:hover .contacts-text {
                            color: #68fdff;
                        }
                        
    /* ------------ 
     * FOOTER
     */
    #footer {
        margin: 54px 0 0;
        height: 100px;
    }
        #social {
            width:72px;
        }
            #social .tw {
                margin: 1px 0 0 6px;
            }
        #contact {
            width:252px;
        }
            .contact-title {
                font-weight: 400;
                text-transform: uppercase;
                color: #647d81;
            }
            .contact-phone {
                font: 30px "Din Display Cyrillic Bold", Arial, Helvetica, sans-serif;
                line-height: 30px;
                color: #fff;
            }
        #copyright {
            color: #7e8a8b;
            width:300px;
            text-align: right;
        }
            #copyright h5 {
                font-size: 12px;
                font-weight: 400;
            }
                #copyright span {
                    color: #cfe4e6;
                }
                

.commerce-text {
	font-size:14px;
	color: #9fbcd5;
}
	.commerce-text span {
		color: #b8d9f5;
	}
#e-commerce .commerce-services {
	color: #d7ebff;
	margin: 25px 0 25px 35px;
}
	#e-commerce .commerce-services li {
		font-size: 16px !important;
	}
.commerce-phone p {
	font-size: 14px;
	color: #9fbcd5;
}
.commerce-phone span {
	color: #fff;
	font:30px/30px 'Din Display Cyrillic Medium', Arial, Helvetica, sans-serif;
	margin: 6px 0 0;
	display: block;
}
.agreement-modal .scollPane {
	width: 950px;
	height: 404px;
	font-size: 13px;
	color: #9cacba;
	overflow: auto;
}
	.agreement-modal .scollPane p {
		margin: 0 0 26px 0;
	}
	.agreement-modal .agreement-title {
		line-height: 18px;
		letter-spacing: 1px;
	}