* { margin:0; padding:0; border: 0;}

body {background: #fff url(images/bg.jpg);background-repeat:no-repeat; background-size: 100%;overflow-x: hidden; font: 13px/20px normal; font-family: Helvetica, Arial, sans-serif;  color: #4F5155;}

a{ text-decoration: none;}
h1,h2,h3,h4{ font-family: "Segoe UI" }

h3{font-size: 18pt; font-weight: normal; }

input[type="text"], input[type="email"], input[type="tel"], input[type="password"], textarea, select{background: #F8F8F8; border: 1px solid #C2C2C2; height: 20px; padding: 5px;font-size: 11pt;}
select{ height: 30px;}
textarea{height: 100px;}

.form-field label{display: inline-block;margin: 5px;}
.ui-dialog form fieldset legend{ font-weight: bold; border-bottom: 1px solid gray; }

label{font-size:12pt;}
ul.errors{list-style: none;}
ul.errors{color: red;}

.btn{ padding: 0.5em; border-radius: 3px;  cursor: pointer; }
.btn-primary { background: #1b82b7; color: white; }
.btn-secondary { background: #656565; color: white; }

/*.button-action{background: url(images/button.png); width: 252px; height: 62px; color: white; font-size: 12pt; font-weight:bold; cursor: pointer;}*/
.button-action{background: url(images/button.png); width: 252px; height: 62px; color: white; font-size: 12pt; font-weight:bold; cursor: pointer;}
.button-action-red{background: url(images/buttonred.png); }
a.button-action{ background: url(images/buttonred.png); display:block; float:right; padding-top: 20px; height: 42px; text-align:center; color: white; font-size: 12pt; font-weight:bold; cursor: pointer; }

.text {padding: 20px;}
.text p{margin: 10px 0;}

a.bigred{
	display:inline-block; background: url(images/bigbutton.png) no-repeat center center ; 
	width: 262px; height: 60px; padding: 6px 3px; color: white; font-size: 20pt; font-weight: bold; text-align: center;
	box-sizing: border-box;
}

.columnWrapper{position:relative;}

.cb{clear:both;}
.column2{width:50%; float:left;}
.column3{width:32%; float:left; margin-left:10px;}
.column-2-3{width:64%; float:left;}
.column4{width:24%; float:left;}

.clickable{ cursor:pointer; }

.toolbar:after{display:block; clear: both; content: ' ';}

.listing table{width: 100%; border-collapse: collapse; margin:10px 0;}
.listing table th{padding: 5px; background: #4D4D4D; color: white;} 
.listing table td{padding: 5px; border-bottom: 1px solid gray;}
.listing table tr.even td{ background: white;}
.listing table tr.odd td{ background: #eee;}
.listing table tr:hover td{ background: #bbb; }
.listing table a{color: -webkit-link; }
.shadowLine{
	/*height: 1px; margin-top: -1px; margin-bottom:10px; width:100%;*/
-webkit-box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 1);
-moz-box-shadow:    0px 0px 20px 0px rgba(0, 0, 0, 1);
box-shadow:         0px 0px 20px 0px rgba(0, 0, 0, 1);
/*background: rgba(160,160,160,0.1);*/	
}

#messages{position:fixed; top:0; left: 0; right:0; z-index: 999; }
.result-message-wrapper{background: none repeat scroll 0 0 rgba(0, 0, 0, 0.8); color: #FFFFFF;font-size: 20pt;padding: 30px 80px 30px 30px; text-align: center;    position:relative; cursor:pointer; }
.msg-fail .icon{background: url(images/msg-status-icons.png) no-repeat scroll -79px 0;  height: 70px; width: 70px; position:absolute; top: 5px; right: 5px; }
.msg-success .icon{background: url(images/msg-status-icons.png) no-repeat scroll 0 0;  height: 70px; width: 70px; position:absolute; top: 5px; right: 5px; }

#topBar{position:absolute; top: 30px; height:36px; width: 100%;z-index: 100;}
.barBackground{background:#4D4D4D; height: 36px; top:0px; position:absolute; }
#topMiddleBar{ height: 36px; width: 1050px; margin:0 auto; position:relative; }
#topLeftBar{ position: absolute; width: 1000px; left: -1000px; }
#topRightBar{ position: absolute; width: 1000px; left: 1050px;}
#logo{position: relative; top:-20px; left: 19px;}
#mainMenu{position: absolute; right:0px; left: 250px;}
#mainMenu ul{ list-style: none; height: 20px; margin: 4px 4px 4px 30px;}
#mainMenu ul li{ float:left; display:block; margin: 0 6px; padding: 3px 6px;}
#mainMenu ul li a{color:white; font-size: 12pt;  text-shadow: 0px 0px 1px rgba(255, 255, 255, 0.5);  font-family:"Segoe UI"; }
#mainMenu ul li:hover{background: #4D4D4D; border-radius:2px; 
-webkit-box-shadow: 0px 0px 9px 0px rgba(20, 20, 20, 0.79);
-moz-box-shadow:    0px 0px 9px 0px rgba(20, 20, 20, 0.79);
box-shadow:         0px 0px 9px 0px rgba(20, 20, 20, 0.79);
}
#mainMenu ul li.right{
	float:right;
	position: relative; 
	top: -5px;
	text-align: right;
	height: 33px;
	width: 130px;
}
#mainMenu ul li.right span{
	position:relative;
	top: -10px;	
}
#mainMenu .submenu{
	width: 150px;
	display:none;
	background: repeat scroll 0 0 #4d4d4d;
	position: absolute; 
	height: auto;
	top: 33px;
	right: -10px;
}
#mainMenu ul li.right:hover .submenu{
	display:block;
}
#mainMenu ul li.right li{
	width: 90%;
	margin-right: 20px;
	box-sizing: border-box;
}
#mainMenu .submenu li.clear{
	height: 0px;
	width: 100%;
	clear: both;
	visibility: hidden;
}

#container{margin: 0 auto;width: 1050px; overflow:hidden;}

#footer{ border: dashed #AEAEAE; border-width: 1px 0 0 0; height: 40px; padding: 10px 5px; margin-top: 20px;}
#footer * {color: #444;  font-size:13px; font-family:"Segoe UI"; text-shadow: 0px 0px 1px rgba(70, 70, 70, 0.8); }
#footer .logo{ float:left; }
#footer .logo img{ vertical-align: middle;}
#footer .logo span{ position:relative; top:6px;}
#footer .footMenu{float:right; display:block; height: 20px; margin: 10px;}
#footer .footMenu li{float:left; display:block; padding: 0 5px; }
#footer .dot-spacer{ height: 20px;border: dotted #AEAEAE; border-width: 0 1px 0 0; margin: 0 3px;}
#footer .footMenu li a:hover{text-shadow: 0px 0px 1px rgba(70, 70, 70, 1); }


#sidebar{float: left; width: 200px;}
#sidebar .panelMenu li{background: #4D4D4D; color:white; padding: 5px 0px 5px 10px; text-align: left; list-style: none; margin-top: 3px;}
#sidebar .panelMenu li:hover{ background: #6D6D6D; }
#sidebar .panelMenu li a{color:white; font-weight: bold;}  
#sidebar .panelMenu .submenu li{text-align: left; font-weight: normal; background: #DDDDDD; padding-left: 1em; }
#sidebar .panelMenu .submenu li:hover{background: #ccc; }
#sidebar .panelMenu .submenu li a{font-weight: normal; color:black; display:inline-block; width: 100%;}
#panelContent{float: right;width: 800px;}
#panelContent h1{margin-bottom: 30px;}

#bigb{ height:448px; }
#smallb{position: relative;height: 188px;overflow:hidden; 
-webkit-box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.2);
-moz-box-shadow:    0px 0px 20px 0px rgba(0, 0, 0, 0.2);
box-shadow:         0px 0px 20px 0px rgba(0, 0, 0, 0.2);
margin-bottom: 20px;
border-radius: 0 0 5px 5px;	
}
#smallb img{ position: absolute; bottom: 0px; right: 0px;}
#smallb h1, #smallb h2 {font-family: "Segoe UI"; text-transform: uppercase; font-weight: normal;  }
#smallb h1{position:absolute; top: 100px; left: 10px; color: #4D4D4D; font-size: 44pt; font-weight:normal; }
#smallb h2{position:absolute; top: 150px; left: 10px; color: #E30C13; font-size: 20pt; font-weight:normal; }

.mainSiteOption{
	background: black none repeat scroll 0 0; color: white; font-size: 13pt; font-weight: bold;padding: 3px 9px 7px;
	position: absolute;  text-shadow: 0 0 2px rgba(0, 0, 0, 1); top: 70px;
	text-align: center;
	width: 250px; 
	border-radius: 4px;
}
.mainSiteOption:hover{background: #222; }
.mainSiteOption span{letter-spacing: 5px;}


#mainSiteBoxes{overflow:hidden; position:relative; margin-top:-1px;}
#mainSiteBoxes .boxes{margin-top:20px;}
#mainSiteBoxes .shadow{position:absolute;height: 1px;width:100%;-webkit-box-shadow: 0px 0px 30px 0px rgba(50, 50, 50, 1);-moz-box-shadow:    0px 0px 30px 0px rgba(50, 50, 50, 1);box-shadow:         0px 0px 30px 0px rgba(50, 50, 50, 1);}

#mainExternalLinks ul, #mainArticles ul{padding-left: 10px;font-size: 15px;line-height: 25px;}
#mainExternalLinks ul a, #mainArticles ul a{color: #4f5155; }
#mainExternalLinks ul a:hover, #mainArticles ul a:hover{text-shadow: 0px 0px 1px rgba(70, 70, 70, 0.5); } 

#dashboardUwrMethods{ float:left; margin-left: 20px;}
#dashboardUwrMethods h3{padding-top: 0px; margin: 30px 0 20px 0; }
#dashboardUwrMethods ul {padding-left: 10px;font-size: 15px;line-height: 25px; }
#dashboardUwrMethods ul a {color: #4f5155; }
#dashboardUwrMethods ul a:hover{text-shadow: 0px 0px 1px rgba(70, 70, 70, 0.5); }

#paymentsMethods{border-top: 1px dashed #AEAEAE; position:relative; margin-top: 30px; padding: 15px; text-align: center;}
#paymentsMethods .title{position:absolute; top: -15px; background: white; left: 0px; padding: 5px 20px 5px 5px; color: #1C4096; }


.dropZone{
	height:100px; width: 100%;
	border: 1px solid black;
	background: #ff6666;
}

.scrollable { position:relative;overflow:hidden; width: 1050px; height:448px;  z-index: 10;}
.scrollable .items {  height: 448px; width:20000em; position:absolute; }
.scrollable .items div.item { float:left; width: 1050px; height: 448px; position:relative; }
.scrollable .items div.item img{position:absolute; top:0; right: 0px; z-index: 200;}
.scrollable .items div.item .textContent{position:absolute; top: 120px; left: 0; z-index: 300; width: 540px; font-family:"Segoe UI"; }
.scrollable .items div.item h2 {
    color: #4D4D4D;
    font-family: "Segoe UI";
    font-size: 34pt;
    line-height: 33pt;
    font-weight: normal;
}
.scrollable .items div.item .p1{ color: #E50C14;font-size: 18pt; line-height: 32pt; font-family:"Segoe UI"}
.scrollable .items div.item .p2{color: #888888; font-size: 18pt; line-height: 20pt; font-family:"Segoe UI"}
.scrollable .items div.item .p2 img{margin:0 10px;position:relative;}
.scrollable .items div.item .p2 b{position:relative;}
.scrollable .navi {z-index: 400; position: absolute; top: 100px; right: 50px; margin-left:328px; width:20px; height:100px;}
.navi a {width:12px;height:12px;margin:5px;background: #4D4D4D;border-radius: 8px;border: 2px solid white;display:block;font-size:1px; -webkit-box-shadow: 0px 0px 10px 0px rgba(50, 50, 50, 1); -moz-box-shadow:    0px 0px 10px 0px rgba(50, 50, 50, 1); box-shadow:  0px 0px 10px 0px rgba(50, 50, 50, 1); }
.navi a:hover {background-position:0 -8px;cursor:pointer;}
.navi a.active {background: #D60A13;}

#calculationBox * {font-family: "Segoe UI"; }
#calculationBox .stepsColumn{ width: 45%; float:left; margin-right:5%;}
#calculationBox .stepsColumn#fullVariant{float:right; margin-right: 0%;}
#calculationBox .stepsColumnFull{ width: 100%; }
#calculationBox .stepsColumnHide{ width: 0%; display:none; overflow:hidden;}
#calculationBox .step{clear:both;border-bottom: 1px dotted gray; margin-bottom: 5px; padding: 10px;}
#calculationBox .stepContent{clear:both; position:relative;}
#calculationBox h2 {font-size: 20pt; font-weight: normal; margin-top: 5px; margin-bottom: 10px;}
#calculationBox h2 span{display: block; width: 26px; height: 23px; padding: 15px; text-align: center;  float: left; background: url(images/whitedot.png); position:relative; top: -14px; color: #CD0B13; font-weight: bold;}

#calculationBox .step.current h2 span{background: url(images/reddot.png); color: white; }
#calculationBox .dropArea{ width: 670px; height: 130px; float: left; background: #E7E7E7; border: 1px white solid; position:relative; 
-webkit-box-shadow: 0px 0px 8px 0px rgba(48, 50, 50, 0.2);
-moz-box-shadow:    0px 0px 8px 0px rgba(48, 50, 50, 0.2);
box-shadow:         0px 0px 8px 0px rgba(48, 50, 50, 0.2);
cursor:pointer;
}
#calculationBox .dropArea p{font-size: 22pt;font-family: "Segoe UI"; width: 450px; color: #ACACAC; background: url(images/dradro.png) no-repeat; padding: 18px 15px 15px 86px; margin: 0 30px 30px;background-position:-2px 32px}
#calculationBox .dropArea p span{font-size:16px;margin-top:10px;line-height:0px;,}
#calculationBox .dropArea p b{font-weight:normal;line-height:27px;}
#calculationBox .attachments{ width: 315px; float: right;  height: 220px; padding: 0 0 0 20px; border-left: 2px dotted #B2B2B2;  margin-top:-50px;}
#calculationBox .attachments h3{ font-family: "Segoe UI"; font-size: 18pt; font-weight: normal;}
#calculationBox .attachments ul{list-style: none; margin-top:5px;}
#calculationBox .attachments .files{overflow-y: scroll; height: 185px; }
#calculationBox .attachments .files li{margin-top: 3px;padding: 3px 5px 10px 32px; background: url(images/fileico.png) no-repeat; border-bottom: 1px solid #FCE6E8;}
#calculationBox .attachments .files li .filename{ max-width: 220px; }
#calculationBox .attachments .files li .progress{ float:right; }
#calculationBox .attachments .files li .progress.ok{color: green; }
#calculationBox .attachments .files li .progress.fail{color: red; }
.qq-upload-button{visibility: hidden;}
.qq-upload-drop-area{visibility: hidden !important; }
form#logosig .qq-upload-button{visibility: visible;}

#calculationBox .dropAreaClone{position:absolute; top: 0; left: 0; width: 670px; height: 130px;}
#calculationBox .form-item{width:90%; padding: 10px;}
#calculationBox input[type="text"],#calculationBox input[type="email"],#calculationBox  input[type="tel"] {width:90%;}
#calculationBox .postData .postCode .form-item{width:30%; float:left;}
#calculationBox .postData .postCity .form-item{width:56%; float:left;}
#calculationBox .stepContent div.cost{position: absolute; width:138px; height: 61px; background: url(images/pricelabel.png);  padding: 0; top: -70px; left: 225px;}
#calculationBox .stepContent span.title{display:block; padding: 0;  color: #4F5155; font-size: 12pt; font-weight: normal; text-align: center; margin-left: 20px; margin-top: 5px;}
#calculationBox .stepContent span.price{display:block; padding: 0; color: #C80B0F; font-size: 24pt; font-weight: bold; text-align: center; font-family: Arial; margin-left: 20px;}
#calculationBox #discountCode{width: 400px }
#calculationBox #variantSelects .selected .columnInner{
	width: 82%;
	background: #eee;
	border-radius: 0 0 3px 3px;
}
#calculationBox #variantSelects button{
	padding: 0 20px;
    width: 227px;
    line-height: 12pt;
}
#calculationBox #variantSelects .variantInfo{
	position:relative; top: -8px;
	width: 227px;
	text-align: center;
	font-size: 14pt;
}

.payMethod{font-size: 14pt;}
.payMethod h3{font-size: 20pt; margin: 20px 0;}
.payuConfirmationPage h1{ color: #E30C11; font-family: "Segoe UI"; font-weight: normal; margin: 30px 0 30px 260px; padding-bottom: 5px; border-bottom: 1px dashed #B2B2B2;}
.payuConfirmationPage img{ float: left; margin: 50px; }
.payuConfirmationPage p{ font-size: 12pt; }
.payuConfirmationPage .amount{font-size: 16pt;vertical-align: middle; }
.payuConfirmationPage .errno{font-size: 16pt; vertical-align: middle;}
#contactFormWrapper{margin-left:20px; }
#contactFormWrapper input[type="text"], #contactFormWrapper textarea{width:90% !important;}
#contactFormWrapper #subject{display:none;} 
#contactData ul{margin:40px; font-size: 16pt; line-height: 16pt; list-style: circle; } 
#contactData ul li{padding: 10px;}
.pricesee ul{list-style:disc;}
.pricesee ul li{font-size:18px;line-height:41px;list-style:disc outside none;margin-left:20px;}
.pricesee ul li span{position:relative;top:18px;}
.pricesee hr{background:none repeat scroll 0 0 rgba(0, 0, 0, 0);border:1px dotted #CECECE;border-width:1px 0 0;margin-top:19px;}
.pricesee p{color:gray;}
#helporder ul li{background:url(images/stepbox.png) no-repeat scroll 0 0 rgba(0, 0, 0, 0);float:left;height:173px;list-style:none outside none;margin:30px;width:150px;position:relative;text-align:center;padding:0 25px;} 
#helporder ul li h2{text-align:center;position:absolute;top:-28px;width:74%;text-transform:uppercase;color:#a3a3a3;}
#helporder ul li hr{border:1px solid #cecece;border-width:1px 0 0 0;left:-6px;position:relative;width:106%;margin:8px 0;}
#helporder ul li .arredright{position:absolute;right:-40px;top:70px;}
#helpoopis{float:left;height:175px;margin-top:27px;width:471px;}
#helpoopis h3{font-size:20px;}
#helpoopis > p > img{margin-left:10px;}
#helpoopis > p > span{position:relative;top:-4px;margin-left:10px;}


#clientLoginForm{
	width: 400px;
	margin: 0 auto;
}
#clientLoginForm .form-item input{
	width: 228px;
}


.datUpdates ul{list-style: none;}
.datUpdates a{ color: #666; font-weight: bold;}
.datUpdates a:hover{color: #222;}

.datPack{ float: left; border: 1px #ddd solid; border-radius: 5px; margin: 2px; width:180px; height: 210px; text-align: center; position:relative;}
.datPack:hover{box-shadow: 0 0 10px #cecece; background: rgb(95%,95%,95%); }
.datPack h2{padding: 10px 0; color: white; background: #808080; }
.datPack .button-action{ display: inline-block; float: none; background: #d30000; width: auto;  height: auto; border-radius: 5px; padding: 5px; 
position: absolute; bottom: 3px; left: 10px; right: 20px;}
.datPack div{margin: 10px 0; }
.datPackPrice{font-size: 16pt;}
.datPackCount{font-size: 12pt; font-weight: bold;}
.datPackExtraInfo{font-size:11pt; font-style: italic;}


.mainBox{ float: left; border: 1px #ddd solid; border-radius: 5px; margin: 20px 2px 2px 2px; width: 150px; height: 150px; text-align: center;  background: rgb(90%,90%,90%);}
.mainBox:hover{box-shadow: 0 0 10px #cecece; background: rgb(95%,95%,95%); }
.mainBox{color: #19668F; font-weight: bold; text-shadow: 0 0 10px #cecece;}
.mainBox h3{margin: 30px 0 10px 0 ; color: #C80000; font-size: 36pt;}
.mainBox .params{margin-top: 5px; color: black; font-size: 9pt; font-weight: normal; }
.mainBox .params .expired{color:red;}

.calcOrderFillForm {
	padding-left: 50px;
}

.calcOrderFillForm input[type="text"], .calcOrderFillForm input[type="tel"], .calcOrderFillForm input[type="email"]{
	width: 400px;
	background: #f8f8f8 none repeat scroll 0 0;
    border: 1px solid #c2c2c2;
    font-size: 11pt;
    height: 20px;
    padding: 5px;
}

.cms-page{ padding: 20px; text-align: justify; }
.cms-page h1{ margin: 20px 0; }

.casecPreview{ background: white; margin: -4px; }
.casecPreview h2{font-size: 14pt;}
.casecPreview label{font-weight: bold; }
.casecBox{ border: solid 1px #777; padding: 2px;}