@font-face {
    font-family: 'Amar Nastaleeq';
    src: url('fonts/amarnastaleeq-webfont.eot');
    src: url('fonts/amarnastaleeq-webfont.eot?#iefix') format('embedded-opentype'), url('fonts/amarnastaleeq-webfont.woff2') format('woff2'), url('fonts/amarnastaleeq-webfont.woff') format('woff'), url('fonts/amarnastaleeq-webfont.ttf') format('truetype'), url('fonts/amarnastaleeq-webfont.svg#Amar Nastaleeq') format('svg');
    font-weight: normal;
    font-style: normal;
}
body {
    font-family: 'Segoe UI', 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif,'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', 'Arial', 'sans-serif' font-family: 'Segoe UI', Frutiger, 'Frutiger Linotype', 'Dejavu Sans', 'Helvetica Neue', Arial, sans-serif;
    background-color: #ffffff;
}

h1 {
    font-family: 'Amar Nastaleeq', 'Segoe UI', Frutiger, 'Frutiger Linotype', 'Dejavu Sans', 'Helvetica Neue', Arial, sans-serif;
    font-size: 1.8em;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    line-height: 26px;
}

h2 {
    font-family: 'Amar Nastaleeq', 'Segoe UI', Frutiger, 'Frutiger Linotype', 'Dejavu Sans', 'Helvetica Neue', Arial, sans-serif;
    font-size: 1.2em;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    line-height: 15px;
} 
h3 {
    font-family: 'Segoe UI', Frutiger, 'Frutiger Linotype', 'Dejavu Sans', 'Helvetica Neue', Arial, sans-serif;
    font-size: 1.2em;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    line-height: 15px;
}

p {
    font-family: 'Segoe UI', Frutiger, 'Frutiger Linotype', 'Dejavu Sans', 'Helvetica Neue', Arial, sans-serif;
    font-size: 1.2em;
    font-style: normal;
    font-variant: normal;
    font-weight: 400;
    line-height: 20px;
}

blockquote {
    font-family: 'Segoe UI', Frutiger, 'Frutiger Linotype', 'Dejavu Sans', 'Helvetica Neue', Arial, sans-serif;
    font-size: 1.5em;
    font-style: normal;
    font-variant: normal;
    font-weight: 400;
    line-height: 30px;
}

ul {
    list-style: none;
}

#container {
    width: 100%;
    padding: 0px;
    clear: both;
    min-width: 600px;
    overflow: hidden;
    margin-left:auto;
    margin-right:auto;
 
}

div.content {
    float: left;
    width: 80%;
    margin-left: 50px;
    margin-right: 50px;
    font-family: 'Segoe UI', Frutiger, 'Frutiger Linotype', 'Dejavu Sans', 'Helvetica Neue', Arial, sans-serif;
}

div.left {
    float: left;
    width: 10%;
    margin-left: 5px;
    margin-right: 5px;
}

.left img {
    display: inline;
    margin-right: 20px;
}

div.footer {
    clear: both;
    margin-left: 20px;
}
div.tab1, div.tab2 { 
  	float: left; 
    text-align: left;
}
 div.tab2 { 
   margin-left:30px;
 }
br.clear {
    clear: both;
}
.main_menu{
 	background-color: black;
    display: block;
    line-height: 1.35em;
    padding: 0 20px 0 20px;
    margin-right: 20px;
    text-align: left;

}
.main_menu li {
    display:inline;
    padding: 10px;
    font-family: sans-serif;
    color:aqua;
}
.main_menu a {
	text-decoration: none;
    color: white;
    font-variant: small-caps;
}
.main_menu a:hover{
 	 background-color: orange;
}
div.caps {
    text-transform: uppercase;
}

bold {
    font-size: 1.2em;
    font-weight: 700;
}
strong {
    font-weight: bold;
}
.label {
    font-family: 'Segoe UI', Frutiger, 'Frutiger Linotype', 'Dejavu Sans', 'Helvetica Neue', Arial, sans-serif;
    text-align: left;
    font-size: 1.1em;
    font-weight: 500;
	padding-right: 25px;
    text-transform: uppercase;
}
.WordOrigin {
    font-family: 'Segoe UI', Frutiger, 'Frutiger Linotype', 'Dejavu Sans', 'Helvetica Neue', Arial, sans-serif;
    text-align: left;
    font-size: 1em;
    padding-left: 15px;
   font-weight: 200;
}
.Kaeshur {
    font-family: 'Amar Nastaleeq';
    text-align: right;
    font-size: 1.1em;
    vertical-align: top;
    padding: 18px;
}
.KaeshurWord {
    font-family: 'Amar Nastaleeq';
    font-size: 2em;
    vertical-align: top;
    padding: 18px;
}
.EnglishWord {
    font-family: 'Segoe UI', Frutiger, 'Frutiger Linotype', 'Dejavu Sans', 'Helvetica Neue', Arial, sans-serif;
    text-align: left;
    font-size: 1.4em;
    padding: 18px;
    vertical-align: top;
}

.button {
   border-top: 1px solid #96d1f8;
   background: #65a9d7;
   background: -webkit-gradient(linear, left top, left bottom, from(#3e779d), to(#65a9d7));
   background: -webkit-linear-gradient(top, #3e779d, #65a9d7);
   background: -moz-linear-gradient(top, #3e779d, #65a9d7);
   background: -ms-linear-gradient(top, #3e779d, #65a9d7);
   background: -o-linear-gradient(top, #3e779d, #65a9d7);
   padding: 5px 10px;
   -webkit-border-radius: 8px;
   -moz-border-radius: 8px;
   border-radius: 8px;
   -webkit-box-shadow: rgba(0,0,0,1) 0 1px 0;
   -moz-box-shadow: rgba(0,0,0,1) 0 1px 0;
   box-shadow: rgba(0,0,0,1) 0 1px 0;
   text-shadow: rgba(0,0,0,.4) 0 1px 0;
   color: white;
   font-size: 14px;
   font-family: Georgia, serif;
   text-decoration: none;
   vertical-align: middle;
   width: 150px;
   }
.button:hover {
   border-top-color: #28597a;
   background: #28597a;
   color: #ccc;
   }
.button:active {
   border-top-color: #1b435e;
   background: #1b435e;
   }
/**tables **/
table
{
	font-family: 'Segoe UI', Frutiger, 'Frutiger Linotype', 'Dejavu Sans', 'Helvetica Neue', Arial, sans-serif;
	background: #fff;
	width: 70%;
	border-collapse: collapse;
}
table th,td
{
    font-size: 1em;
    border: 1px solid #98bf21;
    padding: 3px 7px 2px 7px;
}
table th
{
    font-size: 1.1em;
    text-align: left;
    padding-top: 5px;
    padding-bottom: 4px;
    background-color: #A7C942;
    color: #ffffff;
}
table tr.alt td {
    color: #000000;
    background-color: #EAF2D3;
}
table tbody tr:hover td
{
	color: #009;
}
.table_words
{
  width: 300px;
}
/** audio player styles **/
.audio-player, .audio-player div, .audio-player h2, .audio-player a, .audio-player span, .audio-player button {
    margin: 0;
    padding: 0;
    border: none;
    outline: none;
}

div.audio-player {
    position: relative;
    width: 450px;
    height: 70px;
    margin: 0 auto;
    background: #4c4e5a;
    background: -webkit-linear-gradient(top, #4c4e5a 0%, #2c2d33 100%);
    background: -moz-linear-gradient(top, #4c4e5a 0%, #2c2d33 100%);
    background: -o-linear-gradient(top, #4c4e5a 0%, #2c2d33 100%);
    background: -ms-linear-gradient(top, #4c4e5a 0%, #2c2d33 100%);
    background: linear-gradient(top, #4c4e5a 0%, #2c2d33 100%);
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}

.audio-player h2 {
    position: absolute;
    top: 7px;
    left: 10px;
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
    font-weight: bold;
    font-size: 16px;
    color: #ececec;
    text-shadow: 1px 1px 1px rgba(0,0,0,0.5);
}

/* play/pause control */
.mejs-controls .mejs-button button {
    cursor: pointer;
    display: block;
    position: absolute;
    text-indent: -9999px;
}

.mejs-controls .mejs-play button, .mejs-controls .mejs-pause button {
    width: 34px;
    height: 34px;
    top: 32px;
    left: 7px;
    background: transparent url('playpause.png') 0 0 no-repeat;
}

.mejs-controls .mejs-pause button {
    background-position: 0 -35px;
}


/* mute/unmute control */
.mejs-controls .mejs-mute button, .mejs-controls .mejs-unmute button {
    width: 18px;
    height: 19px;
    top: 9px;
    right: 142px;
    background: transparent url('audio.png') 0 0;
}

.mejs-controls .mejs-unmute button {
    background-position: 0 -19px;
}


/* volume scrubber bar */
.mejs-controls div.mejs-horizontal-volume-slider {
    position: absolute;
    top: 13px;
    right: 15px;
    cursor: pointer;
}

.mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-total {
    width: 120px;
    height: 11px;
    background: #212227;
    -webkit-box-shadow: inset 0px 1px 0px rgba(0,0,0,0.3), 0px 1px 0px rgba(255,255,255,0.25);
    -moz-box-shadow: inset 0px 1px 0px rgba(0,0,0,0.3), 0px 1px 0px rgba(255,255,255,0.25);
    box-shadow: inset 0px 1px 0px rgba(0,0,0,0.3), 0px 1px 0px rgba(255,255,255,0.25);
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
}

.mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-current {
    position: absolute;
    width: 0;
    height: 9px;
    top: 1px;
    left: 1px;
    background: #90d26a;
    background: -webkit-linear-gradient(top, #90d26a 0%, #83bb63 100%);
    background: -moz-linear-gradient(top, #90d26a 0%, #83bb63 100%);
    background: -o-linear-gradient(top, #90d26a 0%, #83bb63 100%);
    background: -ms-linear-gradient(top, #90d26a 0%, #83bb63 100%);
    background: linear-gradient(top, #90d26a 0%, #83bb63 100%);
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
}


/* time scrubber bar */
.mejs-controls div.mejs-time-rail {
    width: 380px;
}

.mejs-controls .mejs-time-rail span {
    position: absolute;
    display: block;
    width: 380px;
    height: 12px;
    top: 40px;
    left: 55px;
    cursor: pointer;
    -webkit-border-radius: 0px 0px 2px 2px;
    -moz-border-radius: 0px 0px 2px 2px;
    border-radius: 0px 0px 2px 2px;
}

.mejs-controls .mejs-time-rail .mejs-time-total {
    background: #565860;
    width: 380px !important; /* fixes display bug using jQuery 1.8+ */
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}

.mejs-controls .mejs-time-rail .mejs-time-loaded {
    top: 0;
    left: 0;
    width: 0;
    background: #7b7d82;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}

.mejs-controls .mejs-time-rail .mejs-time-current {
    top: 0;
    left: 0;
    width: 0;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    background: #90d26a;
    background: -webkit-linear-gradient(top, #90d26a 0%, #83bb63 100%);
    background: -moz-linear-gradient(top, #90d26a 0%, #83bb63 100%);
    background: -o-linear-gradient(top, #90d26a 0%, #83bb63 100%);
    background: -ms-linear-gradient(top, #90d26a 0%, #83bb63 100%);
    background: linear-gradient(top, #90d26a 0%, #83bb63 100%);
}

/* metallic sliders */
.mejs-controls .mejs-time-rail .mejs-time-handle {
    position: absolute;
    display: block;
    width: 20px;
    height: 22px;
    top: -6px;
    background: url('handle-lg.png') no-repeat;
}

.mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-handle {
    position: absolute;
    display: block;
    width: 12px;
    height: 14px;
    top: -1px;
    background: url('handle-sm.png') no-repeat;
}


/* time progress tooltip */
.mejs-controls .mejs-time-rail .mejs-time-float {
    position: absolute;
    display: none;
    width: 33px;
    height: 23px;
    top: -26px;
    margin-left: -17px;
    z-index: 9999;
    background: url('time-box.png');
}

.mejs-controls .mejs-time-rail .mejs-time-float-current {
    width: 33px;
    display: block;
    left: 0;
    top: 4px;
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
    font-size: 10px;
    font-weight: bold;
    color: #666;
    text-align: center;
    z-index: 9999;
}

.KaeshurBold {
    font-size: 18px;
    font-weight: bold;
    color: #666;
    text-align: right;
}

.logincontainer {
  left: 50%;
  position: fixed;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}

/** clearfix **/
.clearfix:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
}

.clearfix {
    display: inline-block;
}

html[xmlns] .clearfix {
    display: block;
}

* html .clearfix {
    height: 1%;
}
.myiframe {
  margin-top: 20px;
  margin-bottom: 30px;

  -moz-border-radius: 12px;
  -webkit-border-radius: 12px;
  border-radius: 12px;

  -moz-box-shadow: 4px 4px 14px #000;
  -webkit-box-shadow: 4px 4px 14px #000;
  box-shadow: 4px 4px 14px #000;
  height:800px;
  width:100%;

}