﻿.menu, .menu ul, .menu li, .menu a {margin: 0;padding: 0;border: none; outline: none;z-index: 5}
.menu {height: 40px;width: 100%;   background: #36aae7;  background: -webkit-linear-gradient(#36aae7, #1fa0e4);  background: -moz-linear-gradient(#36aae7, #1fa0e4);  background: -o-linear-gradient(#36aae7, #1fa0e4);
  background: -ms-linear-gradient(#36aae7, #1fa0e4);  background: linear-gradient(#36aae7, #1fa0e4);  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15);
       -webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;border-left: 1px solid #1682ba;
  border-right: 1px solid #1682ba; border-top: 1px solid #1682ba; text-shadow: 0 1px 1px rgba(0, 0, 0, 0.35);}
.menu li {position: relative;list-style: none;float: left;display: block;height: 40px} .menu li a {display: block;padding: 0 12px; margin: 5px 0;line-height: 28px;text-decoration: none;border-left: 1px solid #393942;border-right: 1px solid #4f5058;font-family: Helvetica, Arial, sans-serif;font-weight: bold;font-size: 14px;color: #f3f3f3;text-shadow: 1px 1px 1px rgba(0,0,0,.6);-webkit-transition: color .2s ease-in-out;-moz-transition: color .2s ease-in-out;-o-transition: color .2s ease-in-out;-ms-transition: color .2s ease-in-out;transition: color .2s ease-in-out;}
.menu li:first-child a { border-left: none} .menu li:last-child a{ border-right: none} .menu li:hover > a { color: #8fde62} .menu ul { position: absolute;top: 40px;left: 0;opacity: 0;background: #3472CC;-webkit-border-radius: 0 0 5px 5px;-moz-border-radius: 0 0 5px 5px;border-radius: 0 0 5px 5px; -webkit-transition: opacity .25s ease .1s;-moz-transition: opacity .25s ease .1s;-o-transition: opacity .25s ease .1s;-ms-transition: opacity .25s ease .1s;transition: opacity .25s ease .1s;}
.menu li:hover > ul { opacity: 1} .menu ul li {height: 0;overflow: hidden;padding: 0;-webkit-transition: height .25s ease .1s;-moz-transition: height .25s ease .1s;-o-transition: height .25s ease .1s;-ms-transition: height .25s ease .1s;transition: height .25s ease .1s;}
.menu li:hover > ul li {height: 36px;overflow: visible;padding: 0} .menu ul li:last-child a { border: none} .menu ul li a {width: 60px;padding: 1px 0 1px 40px;margin: 0;border: none;border-bottom: 1px solid #353539}
.menu ul li:last-child a { border: none} .menu a.softwares { background: url(../images/B/software.png) no-repeat 6px center}
.menu a.ebooks { background: url(../images/B/ebook.png) no-repeat 6px center} .menu a.SerialNumber { background: url(../images/B/SerialNumber.png) no-repeat 6px center}
.menu a.ActivationCode { background: url(../images/B/Activation.png) no-repeat 6px center} .menu a.Charges { background: url(../images/B/charge.png) no-repeat 6px center}
.menu a.Shop { background: url(../images/B/shop.png) no-repeat 6px center} .menu a.search { background: url(../images/B/search.png) no-repeat 6px center}
.menu a.culture { background: url(../images/B/culture.png) no-repeat 6px center} .menu a.contact { background: url(../images/B/contact.png) no-repeat 6px center}
.menu a.advertise { background: url(../images/B/advertise.png) no-repeat 6px center} .menu a.en { background: url(../images/flags/en.png) no-repeat 3px center}
.menu a.fr { background: url(../images/flags/fr.png) no-repeat 3px center} .menu a.fa { background: url(../images/flags/fa.png) no-repeat 3px center}
.menu a.jp { background: url(../images/flags/jp.png) no-repeat 3px center} .menu a.pl { background: url(../images/flags/pl.png) no-repeat 3px center}
.menu a.ru { background: url(../images/flags/ru.png) no-repeat 3px center} .menu a.ar { background: url(../images/flags/ar.png) no-repeat 3px center}
.menu a.zh { background: url(../images/flags/zh.png) no-repeat 3px center} .menu a.de { background: url(../images/flags/de.png) no-repeat 3px center}
.menu a.it { background: url(../images/flags/it.png) no-repeat 3px center} .menu a.es { background: url(../images/flags/es.png) no-repeat 3px center}
.menu a.ko { background: url(../images/flags/ko.png) no-repeat 3px center} .menu a.tr { background: url(../images/flags/tr.png) no-repeat 3px center}
.menu2 {height: 19px;width: 28px;border-radius: 3px} .menu2 li {height: 18px} .menu2 li a {padding: 0 0px; margin: 0 0;line-height: 15px;font-size: 12px}
.menu2 ul {top: 18px} .menu2 li:hover > ul li {height: 25px;overflow: visible;padding: 0} .menu2 ul li a {width: 55px;padding: 4px 0 4px 22px;cursor:pointer} .stH3{font-size:11px; font-weight:normal}
.stTD2{direction:rtl;vertical-align:top;text-align:right} .ad {border-radius:7px;/*border:1px solid lightblue*/}
.ad1,.ad2{ display:none} .Andishe { border:1px solid #64B1FF;border-radius:4px;font-size:14px} .Andishe tr:nth-child(even) td{background:#CCFFFF;border-radius:4px}
.Andishe tr:nth-child(odd) td{background:#BBE9FF;border-radius:4px} .Andishe tr:hover td{background:#CCFFCC;color:Black;border-radius:4px} .Andishe td:first-child{min-width:50%} 
.Andishe td:last-child{min-width:49%}
#tblNavigation {font-size:14px} #tblNavigation a {color:white;text-decoration: none;display: block;padding:5px 0px 5px 0px;border: 1px solid #8DA3E2;vertical-align:middle;background: #568BF5;   background: -webkit-linear-gradient(top, #568BF5 0%,#1115A3 100%);background: -moz-linear-gradient(top, #568BF5 0%,#1115A3 100%);background: -o-linear-gradient(top, #568BF5 0%,#1115A3 100%);background: -ms-linear-gradient(top, #568BF5 0%,#1115A3 100%);background: linear-gradient(top, #568BF5 0%,#1115A3 100%); -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px}
#tblNavigation a:hover {color:yellow ;text-decoration: none;border: 1px solid #607DD7;vertical-align:middle;background: #4C8AF5;background: -webkit-linear-gradient(top, #4C8AF5 0%,#1115A2 100%);background: -moz-linear-gradient(top, #4C8AF5 0%,#1115A2 100%);background: -o-linear-gradient(top, #4C8AF5 0%,#1115A2 100%);background: -ms-linear-gradient(top, #4C8AF5 0%,#1115A2 100%);background: linear-gradient(top, #4C8AF5 0%,#1115A2 100%); -webkit-border-radius: 2px; -moz-border-radius: 2px;border-radius: 2px}
#tblSoalat {font-size:13px} #tblSoalat a {color:white;text-decoration: none;display: block;padding:5px 0px 5px 0px;border: 1px solid #8DA3E2;background-color: #607DD7}
#tblSoalat a:hover {color:yellow ;text-decoration: none;border: 1px solid #607DD7;background-color:#8DA3E2} #tblShop a{color:Blue;display: block;padding: 2px}
#tblShop a:hover{color:yellow;background-color:#4F88FF;text-decoration: none} #tblShop h3{color:Blue} #tblShop h3:hover{color:yellow}
#EnFa a{color:#99FF33;display: block;padding: 5px} #EnFa a:hover{color:yellow;background-color:#8DA3E2} #tblForm a{color: rgb(51,103,255);display: block;padding: 5px}
#tblForm a:hover{color:yellow;background-color:#8DA3E2;text-decoration: none} a{text-decoration: none} a:link {color: rgb(51,103,255)}
a:visited {color: rgb(51,102,204)} a:active {color: rgb(255,153,0)} a:hover	{ text-decoration:underline;color:#3333cc}
a.TextA1:active { color :#07297A; text-decoration : none} a.TextA1:hover{ color : #07297A; text-decoration : none; cursor:default} a.TextA1:link{ color :#07297A; text-decoration : none} a.TextA1:visited{ color : #07297A; text-decoration : none; cursor:default}
a.TextA2:active { color:black ; text-decoration : none} a.TextA2:hover{ color : black ; text-decoration : none; cursor:default} a.TextA2:link{ color :black ; text-decoration : none} a.TextA2:visited{ color : black ; text-decoration : none; cursor:default}
a.TextA3:active { color:#5B1002 ; text-decoration : none} a.TextA3:hover{ color:#5B1002; text-decoration : none; cursor:default} a.TextA3:link{ color:#5B1002; text-decoration : none}
a.TextA3:visited{ color:#5B1002; text-decoration : none; cursor:default} a.TextA4:active { color:White ; text-decoration : none} a.TextA4:hover{ color:White; text-decoration : none; cursor:default}
a.TextA4:link{ color:White; text-decoration : none} a.TextA4:visited{ color:White; text-decoration : none; cursor:default}
img {border:0} table {width:100%;border:0px solid #8585A5} body {direction:rtl;text-align: center ;font-family: Tahoma;background-color:#FFFFFF;background-image:url('/images/BackGround/bg4.jpg');background-repeat: repeat-x; }
p{text-align:justify} .imgS{width:11px;height:11px} .imgS2{width:16px;height:16px}
.HomeTableWidth {border-width: 0px;border-style:none;border-style: none;border-color: inherit;min-width: 946px;max-width: 1200px;}
.MainTable{direction: rtl;text-align: center;background: #8AA6E3;width: 100%;height: 100%;border: 0;}
.subMain{direction: rtl;text-align: center;background: #D9E3FF;height: 0px;border: 0px;}
.newStyle1{font-size: 14px;font-weight: normal;color: #003F7D;text-align: justify;}
.newStyle2{font-size: 14px;font-weight: normal;color: #000000;text-align: justify;}
.newStyle3{font-size: 14px;font-weight: normal;color: #FF0000;text-align: justify;}
.newStyle4{white-space: nowrap;} .newStyle5{color:#800000; font-weight: normal;} .center{text-align: center;white-space:nowrap;width:100%;height: 25px;}
.fontFood {	text-align: center;color: #8DA3E2;font-size: 12px;} .fontFood a{color: #8DA3E2;text-decoration : none; cursor:default}
.SoftwareHeader {color: #6B6D10;font-size: 12px;font-family: tahoma;text-align: center;vertical-align: top;background-color: #D9E3FF;font-weight: normal;}
.SoftwareBody {	font-size: 12px;color: #07297A;	font-weight: normal;text-align: left;background-color: white;border-color:#8AA6E3;border-width:1px}
.Moshakhasat_A_M {font-size: 13px;font-weight: normal;background-color: #D9E3FF;} .HamiRayaneHeader {color:white;font-size: 12px;font-family: tahoma;text-align: center;vertical-align:middle;font-weight: normal;background: #3CB8B1;background: -webkit-linear-gradient(top, #3CB8B1 0%,#238885 100%);background: -moz-linear-gradient(top, #3CB8B1 0%,#238885 100%);background: -o-linear-gradient(top, #3CB8B1 0%,#238885 100%);background: -ms-linear-gradient(top, #3CB8B1 0%,#238885 100%);background: linear-gradient(top, #3CB8B1 0%,#238885 100%);-webkit-border-radius: 2px;-moz-border-radius: 2px;border-radius: 2px;}
.SoftwareHeader1 {color:white;font-size: 12px;font-family: tahoma;text-align: center;vertical-align:middle;font-weight: normal;background: #9DB535;background: -webkit-linear-gradient(top, #9DB535 0%,#79700E 100%);background: -moz-linear-gradient(top, #9DB535 0%,#79700E 100%);background: -o-linear-gradient(top, #9DB535 0%,#79700E 100%);background: -ms-linear-gradient(top, #9DB535 0%,#79700E 100%);background: linear-gradient(top, #9DB535 0%,#79700E 100%);-webkit-border-radius: 2px;-moz-border-radius: 2px;border-radius: 2px;}
.SoftwareHeader2 {color:white;font-size: 12px;font-family: tahoma;vertical-align:middle;font-weight: normal;background: #E65C90;background: -webkit-linear-gradient(top, #E65C90 0%,#7B0E3E 100%);background: -moz-linear-gradient(top, #E65C90 0%,#7B0E3E 100%);background: -o-linear-gradient(top, #E65C90 0%,#7B0E3E 100%);background: -ms-linear-gradient(top, #E65C90 0%,#7B0E3E 100%);background: linear-gradient(top, #E65C90 0%,#7B0E3E 100%);-webkit-border-radius: 2px;-moz-border-radius: 2px;border-radius: 2px;}
.SoftwareHeader3{color:white;font-size: 12px;font-family: tahoma;vertical-align:middle;font-weight: normal;background: #43C770;background: -webkit-linear-gradient(top, #43C770 0%,#238959 100%);background: -moz-linear-gradient(top, #43C770 0%,#238959 100%);background: -o-linear-gradient(top, #43C770 0%,#238959 100%);background: -ms-linear-gradient(top, #43C770 0%,#238959 100%);background: linear-gradient(top, #43C770 0%,#238959 100%);-webkit-border-radius: 2px;-moz-border-radius: 2px;border-radius: 2px;}
.DasteHeader{color:Black;text-align:center;vertical-align:middle;font-weight: normal;background: #E8DFED;background: -webkit-linear-gradient(top, #E8DFED 0%,#C6C1C8 100%);background: -moz-linear-gradient(top, #E8DFED 0%,#C6C1C8 100%);background: -o-linear-gradient(top, #E8DFED 0%,#C6C1C8 100%);background: -ms-linear-gradient(top, #E8DFED 0%,#C6C1C8 100%);background: linear-gradient(top, #E8DFED 0%,#C6C1C8 100%);-webkit-border-radius: 2px;-moz-border-radius: 2px;border-radius: 2px;}
.DasteHeader2{color:Black;text-align: center;vertical-align: middle;background-image:url('../images/BackGround/nbt14.gif');background-repeat: repeat-x;}
.DasteBody{vertical-align:top;color: #07297A;font-weight: normal;background-color:white;} .DasteW{width:200px} .DasteW h1{font-family:Arial;color:black;font-size:16px;margin:4px}
.DasteW h2{font-family:Arial;font-size:15px;margin:3px} .DasteW a{display:block;text-decoration:none}.LatestUpdatesHeader{color:white;font-size: 12px;font-family: tahoma;text-align: center;vertical-align:middle;font-weight: normal;background: #53ADF4;background: -webkit-linear-gradient(top, #53ADF4 0%,#1238A4 100%);background: -moz-linear-gradient(top, #53ADF4 0%,#1238A4 100%);background: -o-linear-gradient(top, #53ADF4 0%,#1238A4 100%);background: -ms-linear-gradient(top, #53ADF4 0%,#1238A4 100%);background: linear-gradient(top, #53ADF4 0%,#1238A4 100%);-webkit-border-radius: 2px;-moz-border-radius: 2px;border-radius: 2px;}
.LatestProductsHeader{color:white;font-size: 12px;font-family: tahoma;text-align: center;vertical-align:middle;font-weight: normal;background: #3CB8B1;background: -webkit-linear-gradient(top, #3CB8B1 0%,#238885 100%);background: -moz-linear-gradient(top, #3CB8B1 0%,#238885 100%);background: -o-linear-gradient(top, #3CB8B1 0%,#238885 100%);background: -ms-linear-gradient(top, #3CB8B1 0%,#238885 100%);background: linear-gradient(top, #3CB8B1 0%,#238885 100%);-webkit-border-radius: 2px;-moz-border-radius: 2px;border-radius: 2px;}
.LatestUpdatesBody{font-size: 12px;color: #07297A;font-weight: normal;text-align: left;background-color:white;border-color:#8AA6E3;border-width:1px;border-color:#8AA6E3;border-width:1px; border-style:solid;    box-shadow: 5px 5px 5px #888888;}
.HomeHeader {color:white;font-size: 14px;font-family: tahoma;vertical-align:middle;font-weight: normal;background: #8389F4;background: -webkit-linear-gradient(top, #8389F4 0%,#112AA5 100%);background: -moz-linear-gradient(top, #8389F4 0%,#112AA5 100%);background: -o-linear-gradient(top, #8389F4 0%,#112AA5 100%);background: -ms-linear-gradient(top, #8389F4 0%,#112AA5 100%);background: linear-gradient(top, #8389F4 0%,#112AA5 100%);-webkit-border-radius: 2px;-moz-border-radius: 2px;border-radius: 2px;}
.HomeBody {background-color:#FFFFFF;font-size: 13px;border-color:Gray;border-width:1px;font-weight: normal;text-align:right;}
.LinkHeader{direction:ltr;text-align:justify;vertical-align:middle;font-weight: normal;background: #E8DFED;background: -webkit-linear-gradient(top, #E8DFED 0%,#C6C1C8 100%);background: -moz-linear-gradient(top, #E8DFED 0%,#C6C1C8 100%);background: -o-linear-gradient(top, #E8DFED 0%,#C6C1C8 100%);background: -ms-linear-gradient(top, #E8DFED 0%,#C6C1C8 100%);background: linear-gradient(top, #E8DFED 0%,#C6C1C8 100%);-webkit-border-radius: 2px;-moz-border-radius: 2px;border-radius: 2px;}
.DescriptionHeader{color:Black ;font-size: 13px;font-family: tahoma;text-align:left ;vertical-align:middle;font-weight: bold;background: #57EE53;background: -webkit-linear-gradient(top, #57EE53 0%,#2A8110 100%);background: -moz-linear-gradient(top, #57EE53 0%,#2A8110 100%);background: -o-linear-gradient(top, #57EE53 0%,#2A8110 100%);background: -ms-linear-gradient(top, #57EE53 0%,#2A8110 100%);background: linear-gradient(top, #57EE53 0%,#2A8110 100%);-webkit-border-radius: 2px;-moz-border-radius: 2px;border-radius: 2px;}
.DescriptionBody{direction:ltr;text-align:justify;font-size: 12px;color: #07297A;font-weight: normal;background-color:white;}
.DescriptionBody3{direction:ltr;text-align:justify;font-size: 13px;color: #07297A;font-weight: normal;background-color:white;}
.DescriptionHeader2{color:Black ;font-size: 13px;font-family: tahoma;text-align:right  ;vertical-align:middle;font-weight: bold;background: #57EE53;background: -webkit-linear-gradient(top, #57EE53 0%,#2A8110 100%);background: -moz-linear-gradient(top, #57EE53 0%,#2A8110 100%);background: -o-linear-gradient(top, #57EE53 0%,#2A8110 100%);background: -ms-linear-gradient(top, #57EE53 0%,#2A8110 100%);background: linear-gradient(top, #57EE53 0%,#2A8110 100%);-webkit-border-radius: 2px;-moz-border-radius: 2px;border-radius: 2px;}
.DescriptionBody2{direction:rtl;text-align:justify;font-size: 12px;color: #07297A;font-weight: normal;background-color:white;}
.AdvertiseBody{direction:rtl;text-align:justify;vertical-align:top;font-size: 6px;font-weight: normal;background-color:#EFEFEF;}
.AdvertiseBody2{direction:rtl;text-align:justify;vertical-align:top;font-size: 6px;font-weight: normal;background-color:#EFEFEF;}
.style1 {direction: ltr;} .style2 {text-align: left;} .style3 {font-size: 13px;color: #000000;font-weight: normal;text-align: right;}
.style4 {text-align: center;} .style6 {vertical-align: middle ;border-width: 0px;} .style7 {color: #FF0000;} .Bezoodi{color:green;}
.Hoshdar {color:#FF6600;} .aspx_page {background: white;font-family: Tahoma;text-align: center;} .aspx_lable_L {text-align:left} .aspx_lable_R {text-align:right}
.aspx_lable_C {text-align:center} .L {text-align:left} .R {text-align:right}
.C {text-align:center} .Alert {font-size: 12px;font-family: Verdana;color: #1508C2;text-align: center;}
.h1style {font-family:Arial;font-size:21px;height:45px;} .RVDL{font-size:11px} .Tech{width:15%; font-weight:bold}
#h1DL h2 {font-size: 1.4em;color: #383848;text-align:left;margin:0;} #h1DL h1 {font-size: 1.4em;color: #383848;text-align:left;margin:0;}
h1 {font-size: 2.0em;color:white ;text-align:center;margin:0;} h2 {font-size: 1.8em;color:inherit;margin:0;}
h3 {font-size: 1.5em;color: #383848;margin:0;} h4 {font-size: 1.25em;color: #383848;margin:0;} h5 {font-size: 0.75em;color:white ;margin:0;}
h6 {font-size: 0.65em;color:white ;text-align:center ;margin:0;}
.viewmore {background-color:#cfcfcf;text-align:right}		
thead {font-size:	1em;word-spacing:	normal;letter-spacing:	normal;text-transform:	none;font-family: Arial, Helvetica, sans-serif}		
tfoot	{font-size:	1em;word-spacing:	normal;letter-spacing:	normal;text-transform:	none;font-family: Arial, Helvetica, sans-serif}		
th {vertical-align:	baseline;font-size:	1em;font-weight:	bold;word-spacing:	normal;letter-spacing:	normal;text-transform:	none;font-family: Arial, Helvetica, sans-serif}
small{font-size:	.7em} ul li {list-style-type:	disc} ul li li{list-style-type:	disc} hr {width:80%;}
#tblQuran a {color:Black ;text-decoration: none;display: block;padding: 3px;background-color:#D5C9ED;}
#tblQuran a:hover {text-decoration: none;border: 1px solid #8DA3E2;background-color:white;}
#tblQuran {background:#D5C9ED;} #tblQuran2 a {color:#000099 ;text-decoration: none;display: block;padding: 3px;background-color:#D5C9ED ;}
#tblQuran2 a:hover {text-decoration: none;border: 1px solid #8DA3E2;background-color:white;} #tblQuran2 {background:#D5C9ED;}
#Pager {font-weight:normal;clear:both;text-align:center;padding:3px 5px 0px 0px;height:40px}
#Pager div {float:right;margin:auto;height:20px}
.PageNumber {font-size:14px}
.PageNumber,.PageNumber:visited,.CurPage  {display:block;float:left;color:#000000;background-color:#ffffff;padding:4px 4px 8px 4px;margin-left:1px;border:1px solid #3399ff}
.PageNumber,.PageNumber:visited {text-decoration:none}
a.PageNumber:Hover,span.CurPage {color:#ffffff;background-color:#ffffff;border:1px solid #ffffff;background-color:#3399ff}
.cssmenu, .cssmenu ul, .cssmenu ul li, .cssmenu ul li a { margin: 0; padding: 0; border: 0; list-style: none; line-height: 1; display: block; position: relative; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
.cssmenu { width: 200px; font-family: Helvetica, Arial, sans-serif; color: #ffffff;} .cssmenu ul ul { display: none;}
.align-right { float: right;} .cssmenu > ul > li > a {padding: 15px 20px;  border-left: 1px solid #1682ba;  border-right: 1px solid #1682ba;  border-top: 1px solid #1682ba;text-shadow: 0 1px 1px rgba(0, 0, 0, 0.35);  cursor: pointer;  z-index: 2; font-size: 15px;  font-weight: bold;  text-decoration: none;  color: #ffffff;  background: #36aae7;  background: -webkit-linear-gradient(#36aae7, #1fa0e4); background: -moz-linear-gradient(#36aae7, #1fa0e4);  background: -o-linear-gradient(#36aae7, #1fa0e4);  background: -ms-linear-gradient(#36aae7, #1fa0e4);  background: linear-gradient(#36aae7, #1fa0e4); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15);}
.cssmenu > ul > li > a:hover,.cssmenu > ul > li.active > a,
.cssmenu > ul > li.open > a {
  color: #eeeeee;  background: #1fa0e4;  background: -webkit-linear-gradient(#1fa0e4, #1992d1);  background: -moz-linear-gradient(#1fa0e4, #1992d1);  background: -o-linear-gradient(#1fa0e4, #1992d1);
  background: -ms-linear-gradient(#1fa0e4, #1992d1);  background: linear-gradient(#1fa0e4, #1992d1);}
.cssmenu > ul > li.open > a {
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 1px rgba(0, 0, 0, 0.15);  border-bottom: 1px solid #1682ba;
}
.cssmenu > ul > li:last-child > a,
.cssmenu > ul > li.last > a {  border-bottom: 1px solid #1682ba;}
.holder { width: 0;  height: 0;  position: absolute;  top: 0;  right: 0;}
.holder::after,
.holder::before {
  display: block;  position: absolute;  content: "";  width: 6px;  height: 6px;  right: 20px;  z-index: 10;  -webkit-transform: rotate(-135deg);  -moz-transform: rotate(-135deg);  -ms-transform: rotate(-135deg);
  -o-transform: rotate(-135deg);  transform: rotate(-135deg);}
.holder::after { top: 17px; border-top: 2px solid #ffffff; border-left: 2px solid #ffffff;}
.cssmenu > ul > li > a:hover > span::after,
.cssmenu > ul > li.active > a > span::after,
.cssmenu > ul > li.open > a > span::after {
  border-color: #eeeeee;
}
.holder::before {  top: 18px;  border-top: 2px solid;  border-left: 2px solid;  border-top-color: inherit;  border-left-color: inherit;}
.cssmenu ul ul li a {  cursor: pointer;  border-bottom: 1px solid #32373e;  border-left: 1px solid #32373e;  border-right: 1px solid #32373e;  padding: 10px 20px;  z-index: 1;  text-decoration: none;  font-size: 16px;
  color: #eeeeee;  background: #3472CC;  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);}
.cssmenu ul ul li:hover > a,
.cssmenu ul ul li.open > a,
.cssmenu ul ul li.active > a {  background: #424852;  color: #ffffff;}
.cssmenu ul ul li:first-child > a {  box-shadow: none;}
.cssmenu ul ul ul li:first-child > a {  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);}
.cssmenu ul ul ul li a {  padding-left: 30px;}
.cssmenu > ul > li > ul > li:last-child > a,
.cssmenu > ul > li > ul > li.last > a {  border-bottom: 0;}
.cssmenu > ul > li > ul > li.open:last-child > a,
.cssmenu > ul > li > ul > li.last.open > a {  border-bottom: 1px solid #32373e;}
.cssmenu > ul > li > ul > li.open:last-child > ul > li:last-child > a {
  border-bottom: 0;
}
.cssmenu ul ul li.has-sub > a::after {
  display: block;  position: absolute;  content: "";  width: 5px;  height: 5px;  right: 20px;  z-index: 10;  top: 11.5px;  border-top: 2px solid #eeeeee;  border-left: 2px solid #eeeeee;  -webkit-transform: rotate(-135deg);
  -moz-transform: rotate(-135deg);  -ms-transform: rotate(-135deg);  -o-transform: rotate(-135deg);  transform: rotate(-135deg);}
.cssmenu ul ul li.active > a::after,
.cssmenu ul ul li.open > a::after,
.cssmenu ul ul li > a:hover::after {
  border-color: #ffffff;
}
.cssmenu ul ul ul li a {
  cursor: pointer;  border-bottom: 1px solid #32373e;  border-left: 1px solid #32373e;  border-right: 1px solid #32373e;  padding: 10px 20px;  z-index: 1;  text-decoration: none;  font-size: 14px;  color: black;
  background: #1682ba;  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
}
@import url(http://fonts.googleapis.com/css?family=Open+Sans);
@import url(http://fonts.googleapis.com/css?family=Montserrat:700);

.accordion {  width: 100%;  max-width: 1080px;  height: 160px;  overflow: hidden;  margin: 20px auto;}

.accordion ul {  width: 100%;  display: table;  table-layout: fixed;  margin: 0;  padding: 0;}

.accordion ul li {  display: table-cell;  vertical-align: bottom;  position: relative;  width: 16.666%;  height: 160px;  background-repeat: no-repeat;  background-position: center center;  transition: all 500ms ease;}

.accordion ul li div {  display: block;  overflow: hidden;  width: 100%;}

.accordion ul li div a {  display: block;  height: 160px;  width: 100%;  position: relative;  z-index: 3;  vertical-align: bottom;  padding: 15px 20px;  box-sizing: border-box;  color: #fff;  text-decoration: none;  font-family: Open Sans, sans-serif;
  transition: all 200ms ease;}

.accordion ul li div a * {
  opacity: 0;  margin: 0;  width: 100%;  text-overflow: ellipsis;  position: relative;  z-index: 5;  white-space: nowrap;  overflow: hidden;  -webkit-transform: translateX(-20px);  transform: translateX(-20px);
  -webkit-transition: all 400ms ease;  transition: all 400ms ease;}

.accordion ul li div a h2 {
  font-family: Montserrat, sans-serif;  text-overflow: clip;  font-size: 24px;  text-transform: uppercase;  margin-bottom: 2px;  top: 20px;}

.accordion ul li div a p {  top: 20px;  font-size: 13.5px;}

.accordion ul li:nth-child(1) { background-color:#8cf6c9; background-image: url("/images/acc/tel.png")}

.accordion ul li:nth-child(2) { background-color:rgba(0, 0, 0, 0.15); background-image: url("/images/acc/pc.png")}

.accordion ul li:nth-child(3) { background-color:gold}

.accordion ul li:nth-child(4) { background-color:#a7e8f1; background-image: url("/images/acc/software.jpg")}

.accordion ul li:nth-child(5) { background-color:gray; background-image: url("/images/acc/software3.png")}

.accordion ul li:nth-child(6) { background-color:goldenrod}

.accordion ul:hover li { width: 8%; }

.accordion ul:hover li:hover { width: 60%; }

.accordion ul:hover li:hover a { background: rgba(0, 0, 0, 0.4); }

.accordion ul:hover li:hover a * {  opacity: 1;  -webkit-transform: translateX(0);  transform: translateX(0);}
 @media screen and (max-width: 600px) {
body { margin: 0; }
.accordion { height: auto; }
.accordion ul li,
.accordion ul li:hover,
.accordion ul:hover li,
.accordion ul:hover li:hover {  position: relative;  display: table;  table-layout: fixed;  width: 100%;  -webkit-transition: none;  transition: none;}
}