/***=======================================

Website : World Tamil Academy
URL : http://www.tamilacademy.com
Author : World Tamil Academy Web Team

========================================***/

/* ==== RESET CSS ==== */

html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,del, dfn, em, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var,b, u, i, center,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td,article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary,time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

a:focus{
	outline:none !important;
	border:none !important;
	text-decoration:none;
}
input[type="text"]:focus{
	outline:none;
}
input[type="password"]:focus{
	outline:none;
}
input[type="email"]:focus{
	outline:none;
}
input[type="number"]:focus{
	outline:none;
}

/****==== FONT =====*****/

/*
 * Noto Sans Tamil UI (Tamil) http://www.google.com/fonts/earlyaccess
 */
/*
@font-face {
  font-family: 'Noto Sans Tamil UI';
  font-style: normal;
  font-weight: 400;
  src: url(../fonts/NotoSansTamilUI-Regular.eot);
  src: url(../fonts/NotoSansTamilUI-Regular.eot?#iefix) format('embedded-opentype'),
       url(../fonts/NotoSansTamilUI-Regular.woff2) format('woff2'),
       url(../fonts/NotoSansTamilUI-Regular.woff) format('woff'),
       url(../fonts/NotoSansTamilUI-Regular.ttf) format('truetype');
}
@font-face {
  font-family: 'Noto Sans Tamil UI';
  font-style: normal;
  font-weight: 700;
  src: url(../fonts/NotoSansTamilUI-Bold.eot);
  src: url(../fonts/NotoSansTamilUI-Bold.eot?#iefix) format('embedded-opentype'),
       url(../fonts/NotoSansTamilUI-Bold.woff2) format('woff2'),
       url(../fonts/NotoSansTamilUI-Bold.woff) format('woff'),
       url(../fonts/NotoSansTamilUI-Bold.ttf) format('truetype');
}
*/

/****==== HEADER ====****/

body{
	font-family: 'Noto Sans Tamil UI', sans-serif, tahoma;
}
.header{
	-webkit-transition: all 0.8s ease-in-out 0s;
	-moz-transition: all 0.8s ease-in-out 0s;
  -o-transition: all 0.8s ease-in-out 0s;
  transition: all 0.8s ease-in-out 0s;
}
.home.header{
	position:fixed;
	top:0px;
	left:0px;
	right:0px;
	z-index:300;
}
.header .navbar{
	margin-bottom:0px;
}
.logo img {
    border-radius: 50%;
    box-shadow: 0 0 2px #000;
    height: 100px;
    width: 100px;
}
.tamil_academy{
	background-color:#55f7fb;
	border-radius:0 0 15px 15px;
	padding:10px;
	color:#000;
	overflow:auto;
	font-weight:bold;
	font-size:14px;
}
.tamil_academy li:first-child{
	float:left;
	margin-left:10px;
	font-size:12px;
}
.tamil_academy li:last-child{
	float:right;
	margin-right:10px;
	letter-spacing:2px;
	font-family:tahoma;
	font-size:14px;
}
.navbar{
	background:none;
	border:none;
}
.navbar-default{
	background:none !important;
	box-shadow:none !important;
}
.logo{
	position:absolute;
	left:0px;
	right:0px;
	margin:0 auto;
	z-index:1001;
	text-align:center;
	-webkit-transition: all 1s ease-in-out;
	-moz-transition: all 1s ease-in-out;
	-o-transition: all 1s ease-in-out;
  	transition: all 1s ease-in-out;
	max-width:100px;
}
.logo:hover{
	transform: rotateY(360deg);
	-webkit-transform: rotateY(360deg);
	-moz-transform: rotateY(360deg);
  	-o-transform: rotateY(360deg);
}

.menu{
	background-color:#fff;
	-webkit-border-radius:0 0 15px 15px;
	-moz-border-radius:0 0 15px 15px;
	-o-border-radius:0 0 15px 15px;
	border-radius:0 0 15px 15px;
	-webkit-box-shadow:0 0 3px #333;
	-moz-box-shadow:0 0 3px #333;
	-o-box-shadow:0 0 3px #333;
	box-shadow:0 0 3px #333;
}
.menu .nav li a{
	color:#000 !important;
	font-size:10px !important;
	font-weight:bold;
	padding:5px;
}
.menu .nav li a:hover{
	color:#ca2b00 !important;
	background:none !important;
}

.menu .m_ico {
    display: inline-block;
    height: 50px;
    vertical-align: middle;
    width: 50px;
}
.m_ico {
    background-color: #fff;
    background-repeat: no-repeat;
    background-size: 30px 30px;
    border-radius: 50%;
    display: inline-block;
    height: 30px;
    margin-right: 0;
    position: relative;
    top: 0;
    vertical-align: middle;
    width: 30px;
}
.menu .m_ico img {
    height: 50px;
    width: 50px;
}
.menu ul li a span {
    display: inline-block;
    line-height: 15px;
    text-align: center;
    vertical-align: middle;
}
.menu .navbar-right{
	margin-right:0 !important;
}
/*
.dropdown:hover .dropdown-menu{
	display:block;
}
*/

.banner{
	position:relative;
}
.banner img{
	width:100%;
}
.inner_slider{
	position:absolute;
	left:0px;
	right:0px;
	bottom:0%;
	text-align:center;
}
.slider_content{
	color:#fff;
	background-color:rgba(46, 208, 212, 1);
	padding:15px;
	-webkit-border-radius:50px 50px 0 0;
	-moz-border-radius:50px 50px 0 0;
	-o-border-radius:50px 50px 0 0;
	border-radius:50px 50px 0 0;
	width:44%;
	margin:0 auto;
	position:relative;
}
.slider_content::before{
	position:absolute;
	left:-45px;
	bottom:0px;
	width:45px;
	height:60px;
	background-image: url("../image/slider_left.png");
	background-repeat:no-repeat;
	content:'';
}
.slider_content::after{
	position:absolute;
	right:-45px;
	bottom:0px;
	width:45px;
	height:60px;
	background-image: url("../image/slider_right.png");
	background-repeat:no-repeat;
	content:'';
}
.slider_content h2{
	font-size:18px;
	font-weight:bold;
	padding-bottom:12px;
	color:#fff;
}
.slider_content p{
	line-height:23px;
	font-size:12px;
	color:#000;
}
.carousel-indicators{
	z-index:3;
}
.wid100{
	width:100%;
}

#home_slider img{
	width:100%;
}
#home_slider .carousel-control{
	top:50%;
}
.carousel-control .fa{	
	-webkit-transition: all 0.4s ease-in-out 0s;
	-moz-transition: all 0.4s ease-in-out 0s;
  	-o-transition: all 0.4s ease-in-out 0s;
  	transition: all 0.4s ease-in-out 0s;
}
#home_slider.carousel .carousel-control{
	opacity:0;
	visibility:hidden;
}
#home_slider.carousel:hover .carousel-control{
	opacity:1;
	visibility:visible;
}

/* ==== STAGES ===== */

.stages{
	padding:50px 0;
}
.stages h2{
	text-align:center;
	font-weight:bold;
	font-size:22px;
	padding-bottom:25px;
}
.stages p{
	text-align:center;
	font-weight:normal;
	font-size:16px;
	line-height:24px;
}
.stage{
	text-align:center;
	position:relative;	
	margin-top:30px;
}
.stage .stage_front{	
	background-color:#ff9f9f;
	padding:25px;
	border-radius:15px;
}
.stages .col-md-3:nth-child(2) .stage_front{
	background-color:#69d2e7;
}
.stages .col-md-3:nth-child(3) .stage_front{
	background-color:#f98f6f;
}
.stages .col-md-3:nth-child(4) .stage_front{
	background-color:#9d87c3;
}
.stages .col-md-3:nth-child(5) .stage_front{
	background-color:#60cd96;
}
.stages .col-md-3:nth-child(6) .stage_front{
	background-color:#f3d474;
}
.stages .col-md-3:nth-child(7) .stage_front{
	background-color:#74b567;
}
.stages .col-md-3:nth-child(8) .stage_front{
	background-color:#94e2d8;
}
.stages .col-md-3:nth-child(9) .stage_front{
	background-color:#cfaf59;
}
.stages .col-md-3:nth-child(10) .stage_front{
	background-color:#3ab6c9;
}
.stages .col-md-3:nth-child(11) .stage_front{
	background-color:#c166d2;
}
.stages .col-md-3:nth-child(12) .stage_front{
	background-color:#5ce984;
}
.stage_front img{
	padding-bottom:15px;
}
.stage_front h3{
	color:#fff;
}
.stage_back{
	opacity:1;
	position:absolute;
	top:0;
	left:0px;
	width:100%;
	height:100%;	
	-webkit-transition: all 0.4s ease-in-out 0s;
	-moz-transition: all 0.4s ease-in-out 0s;
  	-o-transition: all 0.4s ease-in-out 0s;
  	transition: all 0.4s ease-in-out 0s;
	-webkit-border-radius:15px;
	-moz-border-radius:15px;
	-o-border-radius:15px;
	border-radius:15px;
	padding:20px;
	transform:scale(0);	
	-webkit-transform:scale(0);
	-moz-transform:scale(0);
  	-o-transform:scale(0);
	border:1px solid transparent;
}
.stage_back p{
	font-size:14px;
	line-height:17px;
	color:#333;
}
.stage_back a{
	display:inline-block;
	border:1px solid #333;
	color:#333;
	padding:8px 15px 8px 20px;
	margin-top:20px;
	font-size:12px;
	position:relative;	
	-webkit-transition: all 0.4s ease-in-out 0s;
	-moz-transition: all 0.4s ease-in-out 0s;
  	-o-transition: all 0.4s ease-in-out 0s;
  	transition: all 0.4s ease-in-out 0s;
}
.stage_back a::before{
	position:absolute;
	left:8px;
	top:8px;
	font-family:FontAwesome;
	content:'\f101';
}
.stage_back a:hover{
	background-color:#000;
	color:#fff;
	text-decoration:none;
}
.stage:hover .stage_back{
	background-color:rgba(255,255,255,0.8);
	transform:scale(1);	
	-webkit-transform:scale(1);
	-moz-transform:scale(1);
  	-o-transform:scale(1);
	opacity:1;
	border:1px solid #333;
}

/* MEGA MENU STYLE
********************************/ 

.mega-menu {
	padding: 10px ! important;
	width: 750px;
  	border-radius: 0;
  	margin-top: 0px;
	}

	.mega-menu li {
		display: inline-block;
		float: left;
		font-size: 0.94rem;
		padding: 3px 0 7px;
		border-bottom:1px solid #ccc;
		width:100%;
		}

		.mega-menu li.mega-menu-column {
			margin-right: 20px;
			width: 150px;
			border:none;
			}

			.mega-menu .nav-header {
			padding: 0 !important;
			margin-bottom: 10px;
			display: inline-block;
			width: 100%;
			border-bottom: 1px solid #ddd;
			}
      .mega-menu img { padding-bottom: 10px;}
	  
/* Disable Toggle style
********************************/  

/* Dropdown Toggle on style */
.navbar .nav li.dropdown.open > .dropdown-toggle, 
.navbar .nav li.dropdown.active > .dropdown-toggle, 
.navbar .nav li.dropdown.open.active > .dropdown-toggle {
    background: inherit; /* Set to inherit when using mouse hover to open dropdown */
    color: inherit;
    }   
    /* Toggle off style */
    .navbar .nav li.dropdown.open.active > .dropdown-toggle,
    .navbar .nav > li.dropdown > a:focus { 
    background: inherit;
    color: inherit;
    }
    /* Toggle hover */
    .navbar .nav li.dropdown > .dropdown-toggle:hover,
    .navbar .nav li.dropdown.open > .dropdown-toggle:hover {
   
    }
            
            
    /* Toggle caret*/
    .navbar .nav li.dropdown > .dropdown-toggle .caret {
        border-bottom-color:;
        border-top-color:;
        }
        /* Toggle caret hover */
        .navbar .nav li.dropdown > a:hover .caret, 
        .navbar .nav li.dropdown > a:focus .caret {
        border-bottom-color: #333;
        border-top-color: #333;
        }
        /* Toggle caret active */
        .navbar .nav li.dropdown.open > .dropdown-toggle .caret, 
        .navbar .nav li.dropdown.active > .dropdown-toggle .caret, 
        .navbar .nav li.dropdown.open.active > .dropdown-toggle .caret {
        border-bottom-color:#333;
        border-top-color: #333;
        }



/* Hover style
********************************/ 
.navbar .nav > li > a, .mega-menu a
 { 
  -webkit-transition: all 200ms ease;
	 -moz-transition: all 200ms ease;
	  -ms-transition: all 200ms ease;
	   -o-transition: all 200ms ease;
	      transition: all 200ms ease; 
	
		 /* -webkit-transform: translate3d(0, 0, 0); Webkit Hardware Acceleration*/ 
	     -webkit-backface-visibility: hidden; /* Safari Flicker Fix #2 */
	     -webkit-transform: translateZ(0);
}	


#home_slider img{
	width:100%;
}
#home_slider .carousel-control{
	top:50%;
}
.carousel-control .fa{	
	-webkit-transition: all 0.4s ease-in-out 0s;
	-moz-transition: all 0.4s ease-in-out 0s;
  	-o-transition: all 0.4s ease-in-out 0s;
  	transition: all 0.4s ease-in-out 0s;
}
#home_slider.carousel .carousel-control{
	opacity:0;
	visibility:hidden;
}
#home_slider.carousel:hover .carousel-control{
	opacity:1;
	visibility:visible;
}

.dropdown:hover .dropdown-menu{
	display:block;
}

.dropdown-menu > li > a{
	padding:10px 20px;
	border-bottom:1px solid #6fc4d9;
}

.dropdown-menu > li:last-child > a{
	border:none !important;
}

.m_ico{
	background-size:40px 40px;
	background-repeat:no-repeat;
	background-position:center center;
	width:40px;
	height:40px;
	display:inline-block;
	position:relative;
	top:0px;
	margin-right:5px;
	background-color:#fff;
	border-radius:50%;
	-webkit-border-radius:50%;
	-moz-border-radius:50%;
	-o-border-radius:50%;
	vertical-align:middle;
}
.net_class{
	background-image:url('../image/12uyir_eluthu.png');
}
.m_stage1{
	background-image:url('../image/stage1.png');
}
.m_stage2{
	background-image:url('../image/stage2.png');
}
.m_stage3{
	background-image:url('../image/stage3.png');
}
.m_stage4{
	background-image:url('../image/stage4.png');
}
.m_stage5{
	background-image:url('../image/stage5.png');
}
.m_stage6{
	background-image:url('../image/stage6.png');
}
.m_stage7{
	background-image:url('../image/stage7.png');
}
.m_stage8{
	background-image:url('../image/stage9.png');
}

.inner_banner{
	background-image:url(../image/book1.png);
	background-repeat:no-repeat;
	background-color:#2ed0d4;
	width:100%;
	min-height:235px;
	background-size:100%;
	position:relative;
	z-index:1;
}
/*.inner_banner::before{
	background-color:rgba(0,0,0,0.5);
	width:100%;
	height:100%;
	content:'';
	position:absolute;
	z-index:-1;
}*/
.inner_banner h2{
	position:absolute;
	top:54%;
	color:#fff;
	left:0px;
	right:0px;
	text-align:center;
	font-size:24px;
}
ul.breadcum{
	margin:0px;
	padding:0px;
	position:absolute;
	left:0px;
	right:0px;
	bottom:40px;
	text-align:center;
}
ul.breadcum li{
	display:inline;
	color:#fff;
	font-size:12px;
	position:relative;
	margin-right:20px;
}
ul.breadcum li::after{
	content:'/';
	position:absolute;
	right:-15px;
	bottom:2px;
}
ul.breadcum li:last-child::after{
	display:none;
}
ul.breadcum li:last-child{
	margin:0px;
}
ul.breadcum li a{
	color:#000;
}


.lessons_details{
	padding:30px 0;
}
.lessons_details_single{
	text-align:center;
	margin-bottom:50px;
}
.lessons_details_single figure{
	margin-bottom:20px;
}
.lessons_details_single figure img{
	background-color:#dfdfdf;
	border-radius:50%;
}
.lessons_details .col-md-3:nth-child(2) .lessons_details_single figure img{
	background-color:#edbeea;
}
.lessons_details .col-md-3:nth-child(3) .lessons_details_single figure img{
	background-color:#c2c0ff;
}
.lessons_details .col-md-3:nth-child(4) .lessons_details_single figure img{
	background-color:#bec7e6;
}
.lessons_details .col-md-3:nth-child(5) .lessons_details_single figure img{
	background-color:#ffecb9;
}
.lessons_details .col-md-3:nth-child(6) .lessons_details_single figure img{
	background-color:#f7a99d;
}
.lessons_details .col-md-3:nth-child(7) .lessons_details_single figure img{
	background-color:#e5c7d1;
}
.lessons_details .col-md-3:nth-child(8) .lessons_details_single figure img{
	background-color:#e0e9b0;
}
.lessons_details .col-md-3:nth-child(9) .lessons_details_single figure img{
	background-color:#f9caa0;
}
.lessons_details .col-md-3:nth-child(10) .lessons_details_single figure img{
	background-color:#fed665;
}
.lessons_details .col-md-3:nth-child(11) .lessons_details_single figure img{
	background-color:#aacf70;
}
.lessons_details .col-md-3:nth-child(12) .lessons_details_single figure img{
	background-color:#adaaa5;
}
.lessons_details .col-md-3:last-child() .lessons_details_single figure img{
	border-radius:20px !important;
}
.lessons_details h3{
	color:#2ed0d4;
	padding-bottom:30px;
	text-align:center;
	font-size:20px;
}
.lessons_details_single a{
	color:#333;
	display:inline-block;
	font-size:12px;
}
.lessons_details_single a:hover{
	text-decoration:none;
	color:#2ed0d4;
}
.lessons_details_single a figure img{
	-webkit-transition: all 0.4s ease-in-out 0s;
	-moz-transition: all 0.4s ease-in-out 0s;
  	-o-transition: all 0.4s ease-in-out 0s;
  	transition: all 0.4s ease-in-out 0s;
}
.lessons_details_single a:hover figure img{
	-webkit-transform:scale(1.1);
    -moz-transform:scale(1.1);
	-ms-transform:scale(1.1);
	-o-transform:scale(1.1);
	transform:scale(1.1);
}

.sidebar h3{
	color:#2ed0d4;
	margin-bottom:20px;
	font-size:20px;
	position:relative;
	padding-bottom:25px;
	margin-bottom:25px;
	text-align:left;
}
.sidebar h3::before{
	position:absolute;
	left:0px;
	bottom:0px;
	content:'';
	width:75px;
	height:3px;
	background-color:#2ed0d4;
}
.sidebar ul{
	margin:0px 0 30px 0;
	padding:0px;
}
.sidebar ul li{
	padding-bottom:15px;
	position:relative;
	padding-left:30px;
}
.sidebar ul li::before{
	position:absolute;
	left:0px;
	top:0px;
	font-family:FontAwesome;
	content:'\f07b';
	font-size:18px;
	color:#000;
}
.sidebar ul li a{
	color:#333;
}
.sidebar ul li a:hover{
	color:#2ed0d4;
}
.sidebar ul:nth-child(2) li::before{
	content:'\f07c';
}


#show
	{
		margin: 0px;
		width: 600px;
		float: left;
		padding: 0px;
		text-align: center;
		background-color: #FEB69C;
		border-left: 8px solid #FEB69C;
		border-right: 8px solid #FEB69C;
		-moz-border-radius: 10px; 
		border-radius: 10px;
		z-index: 3;
	}
#show .title
	{
		margin: 6px 0px 0px 0px;
		width: 600px;
		float: left;
		padding: 10px 0px 10px 0px;
		text-align: center;
		color: #000000;
		font-family: Arial, Helvetica, sans-serif;
		font-size: 13px;
	}
#show .qaudio
	{
		width: 30px;
		margin: 0px;
		padding: 0px;
		text-align: center;
		float: left;
	}
#show .qaudio a { text-decoration: none; }	
#show .qaudio img { border: none; width: 20px; }
#show .qname
	{
		width: 555px;
		margin: 0px;
		padding: 0px 10px 0px 0px;
		float: left;
		color: #0000FF;
		font-size: 13px;
		text-align: left;
		font-family: Arial, Helvetica, sans-serif;
	}
#show.qname img{ margin: 0px auto; padding: 0px 10px 0px 10px;}	
#show .tbox
	{
		margin: 0px;
		padding: 0px;
		width: 250px;
		height: 25px;
		text-align: center;
		background-color: #FFFFFF;
		border: 1px solid #006600;
	}
#show .button
	{
		padding: 5px;
		margin: 10px 0px 0px 7px;
		cursor: pointer;
	}
#show #ans_table
	{
		float: left;
		width: 600px;
		margin: 0px;
		padding: 0px;
	}
#show #ans_table td
	{
		width: auto;
		height: auto;
		text-align: center;
		margin: 0px;
		padding: 0px 0px 0px 10px;
		float: none;
		vertical-align: middle;
	}	
#show #ans_table #ans
	{
		width: auto;
		height: auto;
		margin: 0px;
		float: left;
		padding: 5px;
		color: #0000FF;
		font-family: Arial, Helvetica, sans-serif;
		font-size: 13px;
	}
	/*end of show detail css */
	
#border
	{
		margin: 0px;
		width: 1000px;
		float: left;
		padding: 0px;
		background-color: #E5FFCE;
		border: 1px solid #006600;
	}
#border a.title
	{
		text-decoration: none;
		font-family: Arial, Helvetica, sans-serif;
		font-size: 13px;
		line-height: 20px;
	}
#border #space
	{
		float: left;
		height: 10px;
	}
#border #view
	{
		margin: 0px;
		width: 1000px;
		height: 605px;
		float: left;
		padding: 0px;
		background-color: #E5FFCE;
		text-align: center;
	}
	
	/*start of left page css*/
#border #view #left
	{
		width: 200px;
		margin: 0px;
		padding: 0px;
		float: left;
	}
	/*end of left page css*/	
	
	/*start of right page css*/
#border #view #right
	{
		width: 800px;
		margin: 0px;
		padding: 0px;
		border-left: 1px solid #006600;
	}
#border #view #right #right_table
	{
		width: 798px;
		margin: 0px;
		padding: 0px;
		float: left;
	} 
#border #view #right #right_table #heading
	{
		margin: 0px 0px 0px 1px;
		width: 798px;
		padding: 10px 0px 10px 0px;
		float: left;
		background-color: #006600;
		color: #FFFFFF;
		font-size: 13px;
		line-height: 20px;
		font-family: Arial, Helvetica, sans-serif;
		border-bottom: 1px solid #006600;
	}
#border #view #right #right_table #content
	{
		width: 775px;
		margin: 0px auto;
		padding: 0px;
	}
#border #view #right #right_table #content #view_table
	{
		width: 775px;
		margin: 0px auto;
		padding: 0px;
	}
#border #view #right #right_table #content #view_table td.center
	{
		width: 775px;
		margin: 0px auto;
		padding: 0px;
		float: left;
		text-align: center;
		background-image:url(../image/view_center.png);
		background-repeat: repeat-y;
	}
#border #view #right #right_table #content #view_table td.center #title
	{
		width: 775px;
		margin: 0px auto;
		border-top: 5px solid #FEB69C;
	}
#border #view #right #right_table #content #view_table td.center #title span
	{
		float: left;
		width: 768px;
		margin: 0px 0px 0px 2px;
		padding: 5px 0px 5px 0px;
		background-color: #006600;
		text-align: center;
		color: #FFFFFF;
		font-family: Geneva, Arial, Helvetica, sans-serif;
		font-size: 13px;
		border: 1px solid #006600;
	}		
#border #view #right #right_table #content #view_table #grades
	{
		width: 230px;
		margin: 0px auto;
		padding: 0px;
		text-align: center;
	}
#border #view #right #right_table #content #view_table #grades td
	{
		float: left;
		margin: 0px;
		padding: 0px;
	}		
#border #view #right #right_table #content #view_table #grades td.top
	{
		width: 230px;
		height: 10px;
		margin: 0px auto;
		padding: 0px;
		float: left;
		text-align: center;
		background-image:url(../image/grade_top.png);
		background-repeat: no-repeat;
	}
#border #view #right #right_table #content #view_table #grades td.center
	{
		width: 230px;
		margin: 0px auto;
		padding: 0px;
		float: left;
		text-align: center;
		background-image:url(../image/grade_center.png);
		background-repeat: repeat-y;
	}
#border #view #right #right_table #content #view_table #grades td.center img
	{
		width: 80px;
		height: 80px;
	}	
#border a.title
	{
		text-decoration: none;
		font-family: Arial, Helvetica, sans-serif;
		font-size: 13px;
		line-height: 20px;
	}
#border #view #right #right_table #space
	{
		float: left;
		height: 10px;
	}
#border #view #right #right_table #content #view_table #grades td.bottom
	{
		width: 230px;
		height: 10px;
		margin: 0px auto;
		padding: 0px;
		float: left;
		text-align: center;
		background-image:url(../image/grade_bottom.png);
		background-repeat: no-repeat;
	}
#border #view #right #right_table #content #view_table td.bottom
	{
		width: 775px;
		height: 20px;
		margin: 0px auto;
		padding: 0px;
		float: left;
		text-align: center;
		background-image:url(../image/view_bottom.png);
		background-repeat: no-repeat;
	}
	/*end of the page css*/
	

.lessons_details .col-md-9 .col-md-4 .syllabus_data{
	text-align:center;
	margin-bottom:30px;
	background-color:#ccc;
	border-radius:15px;
	padding:20px;
	min-height:130px;
	line-height:22px;
	opacity:0.9;
}
.lessons_details .col-md-9 .col-md-4 .syllabus_data:hover{
	opacity:1;
}
.lessons_details .col-md-9 .col-md-4 .syllabus_data a{
	color:#333;
}
.lessons_details .col-md-9 .col-md-4 .syllabus_data a:hover{
	text-decoration:none;
}
.lessons_details .col-md-9 .col-md-4:nth-child(2) .syllabus_data{
	background-color:#edbeea;
}
.lessons_details .col-md-9 .col-md-4:nth-child(3) .syllabus_data{
	background-color:#c2c0ff;
}
.lessons_details .col-md-9 .col-md-4:nth-child(4) .syllabus_data{
	background-color:#bec7e6;
}
.lessons_details .col-md-9 .col-md-4:nth-child(5) .syllabus_data{
	background-color:#ffecb9;
}
.lessons_details .col-md-9 .col-md-4:nth-child(6) .syllabus_data{
	background-color:#f7a99d;
}
.lessons_details .col-md-9 .col-md-4:nth-child(7) .syllabus_data{
	background-color:#e5c7d1;
}
.lessons_details .col-md-9 .col-md-4:nth-child(8) .syllabus_data{
	background-color:#e0e9b0;
}
.lessons_details .col-md-9 .col-md-4:nth-child(9) .syllabus_data{
	background-color:#f9caa0;
}
.lessons_details .col-md-9 .col-md-4:nth-child(10) .syllabus_data{
	background-color:#fed665;
}
.lessons_details .col-md-9 .col-md-4:nth-child(11) .syllabus_data{
	background-color:#aacf70;
}
.lessons_details .col-md-9 .col-md-4:nth-child(12) .syllabus_data{
	background-color:#adaaa5;
}
.lessons_details .col-md-9 .col-md-4:nth-child(13) .syllabus_data{
	background-color:#edbeea;
}
.lessons_details .col-md-9 .col-md-4:nth-child(14) .syllabus_data{
	background-color:#c2c0ff;
}
.lessons_details .col-md-9 .col-md-4:nth-child(12) .syllabus_data{
	background-color:#bec7e6;
}
.lessons_details .col-md-9 .col-md-4:nth-child(16) .syllabus_data{
	background-color:#ffecb9;
}
.lessons_details .col-md-9 .col-md-4:nth-child(17) .syllabus_data{
	background-color:#f7a99d;
}
.lessons_details .col-md-9 .col-md-4:nth-child(18) .syllabus_data{
	background-color:#e5c7d1;
}
.lessons_details .col-md-9 .col-md-4:nth-child(19) .syllabus_data{
	background-color:#e0e9b0;
}
.lessons_details .col-md-9 .col-md-4:nth-child(20) .syllabus_data{
	background-color:#f9caa0;
}
.lessons_details .col-md-9 .col-md-4:nth-child(21) .syllabus_data{
	background-color:#fed665;
}
.lessons_details .col-md-9 .col-md-4:nth-child(22) .syllabus_data{
	background-color:#aacf70;
}
.lessons_details .col-md-9 .col-md-4:nth-child(23) .syllabus_data{
	background-color:#adaaa5;
}
.lessons_details .col-md-9 .col-md-4:nth-child(24) .syllabus_data{
	background-color:#edbeea;
}
.lessons_details .col-md-9 .col-md-4:nth-child(25) .syllabus_data{
	background-color:#c2c0ff;
}
.lessons_details .col-md-9 .col-md-4:nth-child(26) .syllabus_data{
	background-color:#bec7e6;
}
.lessons_details .col-md-9 .col-md-4:nth-child(27) .syllabus_data{
	background-color:#ffecb9;
}
.lessons_details .col-md-9 .col-md-4:nth-child(28) .syllabus_data{
	background-color:#f7a99d;
}
.lessons_details .col-md-9 .col-md-4:nth-child(29) .syllabus_data{
	background-color:#e5c7d1;
}
.lessons_details .col-md-9 .col-md-4:nth-child(30) .syllabus_data{
	background-color:#e0e9b0;
}
.lessons_details .col-md-9 .col-md-4:nth-child(31) .syllabus_data{
	background-color:#f9caa0;
}
.lessons_details .col-md-9 .col-md-4:nth-child(32) .syllabus_data{
	background-color:#fed665;
}
.lessons_details .col-md-9 .col-md-4:nth-child(33) .syllabus_data{
	background-color:#aacf70;
}
.lessons_details .col-md-9 .col-md-4:nth-child(34) .syllabus_data{
	background-color:#adaaa5;
}


/*start of share url css */
#share_url #show
	{
		margin: 0px;
		margin-left: 10px;
		width: 555px;
		float: left;
		padding: 0px;
		text-align: center;
		background-color: #FEB69C;
		border-left: 0px solid #FEB69C;
		border-right: 0px solid #FEB69C;
		-moz-border-radius: 20px; 
		border-radius: 20px;
	}
	#share_url,
	#shows{
		z-index: 99;
	}
#share_url #show .title
	{
		margin: 6px 0px 0px 0px;
		width: 553px;
		float: left;
		padding: 10px 0px 10px 0px;
		text-align: center;
		color: #000000;
		font-family: Arial, Helvetica, sans-serif;
		font-size: 13px;
	}
#share_url #show #box
	{
		margin: 0px auto;
		width: 550px;
		padding: 0px;
		text-align: center;
		background-color: #FFFFFF;
		-moz-border-radius: 10px; 
		border-radius: 10px;
		text-align: center;
	}
#share_url #show #box .tbox
	{
		margin: 0px auto;
		padding: 0px;
		width: 500px;
		height: 25px;
		cursor: pointer;
		border: 1px solid #006600;
	}
	
	
#share_url #show #box input[type="text"]{
	display:inline;
	background-color:rgba(46,208,201,0.2);
	padding:10px 10px;
	border-radius: 10px 0px 0px 10px;
	color:#000;
	width:460px;
	height: 50px;
	border:1px solid rgba(46,208,201,1);
	margin:0 0px 0px 0;
	text-align:center;
	min-width:465px;
}

#share_url #show #box .btn{
    color: rgba(255,255,255,1);
    text-decoration: none;
    background-color: #2ed0d4;
    display: inline-block;
    padding: 5px 20px;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 0px 8px 8px 0px;
    margin-bottom: 4px;
    margin-left: -5px;
	width: auto;
	height: 50px;
	text-align: center;
	border: none;
}

#share_url #show #box input[type="button"]{
    color: rgba(255,255,255,1);
    text-decoration: none;
    background-color: #2ed0d4;
    display: inline-block;
    padding: 8px 20px;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
    -webkit-box-shadow: 0px 9px 0px rgba(41,168,171,1), 0px 9px 25px rgba(0,0,0,.4);
    -moz-box-shadow: 0px 9px 0px rgba(41,168,171,1), 0px 9px 25px rgba(0,0,0,.4);
    box-shadow: 0px 9px 0px rgba(41,168,171,1), 0px 9px 25px rgba(0,0,0,.4);
    margin-bottom: 5px;
	width: auto;
	text-align: center;
	border: none;
	
	-webkit-transition: all .1s ease;
	-moz-transition: all .1s ease;
	-ms-transition: all .1s ease;
	-o-transition: all .1s ease;
	transition: all .1s ease;
}
	/*end of share url css */
	
	
	
	/*start of show time error css */
#error_minute
	{
		margin: 0px;
		margin-left: 10px;
		width: 555px;
		float: left;
		padding: 0px;
		text-align: center;
		background-color: #FF0000;
		border-left: 0px solid #FF0000;
		border-right: 0px solid #FF0000;
		-moz-border-radius: 20px; 
		border-radius: 20px;
		z-index: 2;
	}
#error_minute .top
	{
		width: 400px;
		height: 10px;
		margin: 0px;
		padding: 0px;
		float: left;
		background-image:url(../image/time_top.png);
		background-repeat: no-repeat;
	}
#error_minute .center
	{
		width: 400px;
		margin: 0px auto;
		padding: 0px;
		float: left;
		text-align: center;
		background-image:url(../image/time_center.png);
		background-repeat: repeat-y;
	}
#error_minute .center .title
	{
		margin: 0px 0px 0px 1px;
		width: 555px;
		float: left;
		padding: 0px 0px 5px 0px;
		text-align: center;
		color: #FFFFFF;
		font-family: Arial, Helvetica, sans-serif;
		font-size: 13px;
		font-weight: bold;
	}
#error_minute .center #error_msg
	{
		margin: 0px auto;
		font-family: Arial, Helvetica, sans-serif;
		font-size: 13px;
		font-weight: bold;
		color: #0000FF;
		padding: 10px 0px 10px 0px;
	}		
#error_minute input[type="button"], #error_minute input[type="button"]
	{
    color: rgba(255,255,255,1);
    text-decoration: none;
    background-color: #2ed0d4;
    display: inline-block;
    padding: 8px 20px;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
    -webkit-box-shadow: 0px 9px 0px rgba(41,168,171,1), 0px 9px 25px rgba(0,0,0,.4);
    -moz-box-shadow: 0px 9px 0px rgba(41,168,171,1), 0px 9px 25px rgba(0,0,0,.4);
    box-shadow: 0px 9px 0px rgba(41,168,171,1), 0px 9px 25px rgba(0,0,0,.4);
    margin-bottom: 5px;
	width: auto;
	text-align: center;
	border: none;
	
	-webkit-transition: all .1s ease;
	-moz-transition: all .1s ease;
	-ms-transition: all .1s ease;
	-o-transition: all .1s ease;
	transition: all .1s ease;
	}	
#error_minute .bottom
	{
		width: 400px;
		height: 10px;
		margin: 0px;
		padding: 0px;
		float: left;
		background-image:url(../image/time_bottom.png);
		background-repeat: no-repeat;
	}
	/*end of show time error css */
	
	/*start of show detail css */
#showdetail #show
	{
		margin: 0px;
		margin-left: 0px;
		margin-right: 1px;
		width: 407px;
		float: left;
		padding: 0px;
		text-align: center;
		background-color: #FEB69C;
		border-left: 1px solid #FEB69C;
		border-right: 300px solid #FEB69C;
		-moz-border-radius: 20px; 
		border-radius: 20px;
	}
#show
	{
		margin: 0px;
		margin-left: 2px;
		margin-right: 2px;
		width: 500px;
		float: left;
		padding: 0px;
		text-align: center;
		background-color: #FEB69C;
		border-left: 0px solid #FEB69C;
		border-right: 0px solid #FEB69C;
		-moz-border-radius: 20px; 
		border-radius: 20px;
	}
#show .title
	{
		margin: 6px 0px 0px 0px;
		width: 500px;
		float: left;
		padding: 10px 0px 10px 0px;
		text-align: center;
		color: #000000;
		font-family: Arial, Helvetica, sans-serif;
		font-size: 13px;
	}
#show input[type="text"]{
	display:inline;
	background: #FFF;
	padding:10px 10px;
	border-radius: 10px;
	color:#000;
	width:500px;
	height: 40px;
	border:1px solid rgba(46,208,201,1);
	margin: 30px 0px 0px 0;
	text-align:center;
	min-width:465px;
}

#show input[type="button"]{
    color: rgba(255,255,255,1);
    text-decoration: none;
    background-color: #2ed0d4;
    display: inline-block;
    padding: 8px 20px;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
    -webkit-box-shadow: 0px 9px 0px rgba(41,168,171,1), 0px 9px 25px rgba(0,0,0,.4);
    -moz-box-shadow: 0px 9px 0px rgba(41,168,171,1), 0px 9px 25px rgba(0,0,0,.4);
    box-shadow: 0px 9px 0px rgba(41,168,171,1), 0px 9px 25px rgba(0,0,0,.4);
    margin-top: 15px;
    margin-right: 15px;
    margin-bottom: 15px;
	width: auto;
	text-align: center;
	border: none;
	
	-webkit-transition: all .1s ease;
	-moz-transition: all .1s ease;
	-ms-transition: all .1s ease;
	-o-transition: all .1s ease;
	transition: all .1s ease;
}	
#show .qaudio
	{
		width: 30px;
		margin: 0px;
		padding: 0px;
		text-align: center;
		float: left;
	}
#show .qaudio a { text-decoration: none; }	
#show .qaudio img { border: none; width: 20px; }
#show .qname
	{
		width: 525px;
		margin: 0px;
		padding: 0px 10px 0px 0px;
		float: left;
		color: #000;
		font-size: 13px;
		text-align: left;
		font-family: Arial, Helvetica, sans-serif;
	}
#show.qname img{ margin: 0px auto; padding: 0px 10px 0px 10px;}	
#show .tbox
	{
		margin: 0px;
		padding: 0px;
		width: 250px;
		height: 25px;
		text-align: center;
		background-color: #FFFFFF;
		border: 1px solid #006600;
	}
#show .button
	{
		padding: 5px;
		margin: 10px 0px 0px 7px;
		cursor: pointer;
	}
#show #ans_table
	{
		float: left;
		width: 570px;
		margin: 0px;
		padding: 0px;
	}
#show #ans_table td
	{
		width: auto;
		height: auto;
		text-align: center;
		margin: 0px;
		padding: 0px 0px 0px 10px;
		float: none;
		vertical-align: middle;
		color: #000;
	}	
#show #ans_table #ans
	{
		width: auto;
		height: auto;
		margin: 0px;
		float: left;
		padding: 5px;
	}
#show #ans_table #ans img { border: none;}		
#show td.name
	{
		margin: 0px;
		padding: 0px;
		width: 250px;
		color: #0000FF;
		font-family: Arial, Helvetica, sans-serif;
		font-size: 13px;
		vertical-align: middle;
		padding: 5px 0px 5px 0px;
	}
#show td.dot
	{
		margin: 0px;
		padding: 0px;
		width: 20px;
		color: #0000FF;
		font-family: Arial, Helvetica, sans-serif;
		font-size: 13px;
		font-weight: bold;
		vertical-align: middle;
		padding: 5px 0px 5px 0px;
	}
	/*end of show detail css */
	

	/*start of show mark css */
	#show_mark{
		margin: 0px;
		margin-left: -163px;
		width: 554px;
		height: 350px;
		float: left;
		padding: 0px;
		text-align: center;
		background-color: #B6FE9C;
		border-left: 0px solid #B6FE9C;
		border-right: 0px solid #B6FE9C;
		-moz-border-radius: 20px; 
		border-radius: 20px;
		z-index: 99999;
	}
#show_mark #marks
	{
		margin: 0px;
		width: 554px;
		float: left;
		padding: 0px;
		text-align: center;
	}
#show_mark #marks .center .title
	{
		margin: 0px;
		margin-top: 10px;
		margin-left: 10px;
		width: 553px;
		background: #FEB69C;
		padding: 10px 0px 10px 10px;
		text-align: center;
		-moz-border-radius: 20px; 
		border-radius: 20px;
		color: #000;
		z-index: 99999;	
	}
#show_mark #marks .center img
	{
		margin: 5px 0px 5px 0px;
		width: 350px;
	}
#show_mark #marks #txtdot
	{	
		font-family: Geneva, Arial, Helvetica, sans-serif;
		font-size: 13px;
		color: #0000FF; 
		padding: 10px 0px 10px 0px; 
		border: 1px dotted #900;
		background: #FFF;
	}
#show_mark #marks .center .dot
	{	
		font-family: Geneva, Arial, Helvetica, sans-serif;
		font-size: 13px;
		color: #0000FF; 
	}		
#show_mark #marks .center .txt
	{
		margin: 0px 20px 0px 20px;
		font-family: Geneva, Arial, Helvetica, sans-serif;
		font-size: 13px;
		color: #0000FF;
	}		
#show_mark #marks input[type="button"]{
    color: rgba(255,255,255,1);
    text-decoration: none;
    background-color: #2ed0d4;
    display: inline-block;
    padding: 8px 20px;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
    -webkit-box-shadow: 0px 9px 0px rgba(41,168,171,1), 0px 9px 25px rgba(0,0,0,.4);
    -moz-box-shadow: 0px 9px 0px rgba(41,168,171,1), 0px 9px 25px rgba(0,0,0,.4);
    box-shadow: 0px 9px 0px rgba(41,168,171,1), 0px 9px 25px rgba(0,0,0,.4);
    margin-bottom: 5px;
	width: auto;
	text-align: center;
	border: none;
	
	-webkit-transition: all .1s ease;
	-moz-transition: all .1s ease;
	-ms-transition: all .1s ease;
	-o-transition: all .1s ease;
	transition: all .1s ease;
	}	
	/*end of show mark css */
	
	/*start of show keyboard css */
#show_keyboard
	{
		margin: 0px;
		margin-left: 15px;
		float: left;
		padding: 0px;
		text-align: center;
		background-color: #FEB69C;
		border-left: 0px solid #FEB69C;
		border-right: 0px solid #FEB69C;
		-moz-border-radius: 20px; 
		border-radius: 20px;
		width: 555px;
		height: 340px;
		z-index: 2;
	}
#show_keyboard #keyboard .center #views
	{
		margin-left: 13px;
	}	
#show_keyboard #keyboard .center #views .title
	{
		width: 530px;
		margin: 0px;
		background: #F90;
		-moz-border-radius: 20px 20px 0px 0px; 
		border-radius: 20px 20px 0px 0px;
		padding: 10px 0px 10px 0px;
		margin-top: 10px;
		text-align: center;
		float: left;
		color: #FFF;
	}
#show_keyboard #keyboard input[type="text"]{
	display:inline;
	background: #FFF;
	padding:10px 10px;
	border-radius: 10px;
	color:#000;
	width:500px;
	height: 40px;
	border:1px solid rgba(46,208,201,1);
	margin: 30px 0px 0px 0;
	text-align:center;
	min-width:465px;
}

#show_keyboard #keyboard input[type="button"]{
    color: rgba(255,255,255,1);
    text-decoration: none;
    background-color: #2ed0d4;
    display: inline-block;
    padding: 8px 20px;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
    -webkit-box-shadow: 0px 9px 0px rgba(41,168,171,1), 0px 9px 25px rgba(0,0,0,.4);
    -moz-box-shadow: 0px 9px 0px rgba(41,168,171,1), 0px 9px 25px rgba(0,0,0,.4);
    box-shadow: 0px 9px 0px rgba(41,168,171,1), 0px 9px 25px rgba(0,0,0,.4);
    margin-top: 15px;
    margin-right: 15px;
    margin-bottom: 15px;
	width: auto;
	text-align: center;
	border: none;
	
	-webkit-transition: all .1s ease;
	-moz-transition: all .1s ease;
	-ms-transition: all .1s ease;
	-o-transition: all .1s ease;
	transition: all .1s ease;
}		
	/*end of show keyboard css */
	
#border
	{
		margin: 0px;
		width: 1000px;
		float: left;
		padding: 0px;
		background-color: #E5FFCE;
		border: 1px solid #006600;
	}
#border #view
	{
		margin: 0px;
		width: 1000px;
		height: 640px;
		float: left;
		padding: 0px;
		background-color: #E5FFCE;
		text-align: center;
	}
	
	/*start of left page css*/
#border #view #left
	{
		width: 200px;
		margin: 0px;
		padding: 0px;
		float: left;
	}
	/*end of left page css*/	
	
	/*start of center page css*/
#border #view #center
	{
		width: 600px;
		margin: 0px;
		padding: 0px;
		border-left: 1px solid #006600;
		border-right: 1px solid #006600;
	}
#border #view #center #center_table
	{
		width: 600px;
		margin: 0px;
		padding: 0px;
		float: left;
	} 
#border #view #center #center_table #grade_table 
	{
		width: 600px;
		margin: 0px;
		padding: 0px;
		float: left;
	}
#border #view #center #center_table #grade_table .title
	{
		margin: 0px 1px 0px 1px;
		width: 601px;
		padding: 9px 0px 9px 0px;
		float: left;
		background-color: #006600;
		color: #FFFFFF;
		font-size: 13px;
		font-family: Geneva, Arial, Helvetica, sans-serif;
		border-top: none;
		border: 1px solid #006600;
	}
#border #view #center #center_table #grade_table .title a
	{
		text-decoration: none;
		color: #FFFFFF;
		font-size: 13px;
		font-family: Geneva, Arial, Helvetica, sans-serif;
	}
#border #view #center #center_table #grade_table img
	{
		border: none;
	}
#border #view #center #center_table #grade_table #ques_table
	{
		width: 590px;
		margin: 0px 5px 0px 5px;
		padding: 0px 0px 10px 0px;
		float: left;
	}
	/* start of the instruction css*/
#border #view #center #center_table #grade_table #ques_table #instruct_table
	{
		width: 550px;
		margin: 10px 0px 0px 20px;
		padding: 0px;
		float: left;
		text-align: center;
	}
#border #view #center #center_table #grade_table #ques_table #instruct_table td.top
	{
		width: 550px;
		height: 10px;
		margin: 0px auto;
		padding: 0px;
		float: left;
		text-align: center;
		background-image:url(../image/instruct_top.png);
		background-repeat: no-repeat;
	}	
#border #view #center #center_table #grade_table #ques_table #instruct_table td.center
	{
		width: 550px;
		margin: 0px auto;
		padding: 0px;
		float: left;
		text-align: left;
		background-image:url(../image/instruct_center.png);
		background-repeat: repeat-y;
	}
#border #view #center #center_table #grade_table #ques_table #instruct_table td.center span
	{
		font-size: 15px;
		color: #990000;
		text-align: left;
		padding: 0px 0px 0px 15px;
	}	
#border #view #center #center_table #grade_table #ques_table #instruct_table td.center ul
	{
		float: left;
		padding: 0px;
		margin: 0px 10px 0px 10px;
	}	
#border #view #center #center_table #grade_table #ques_table #instruct_table td.center ul li
	{
		padding: 0px;
		margin: 0px 10px 0px 10px;
		list-style: none;
		color: #006666;
		font-family: Arial, Helvetica, sans-serif;
		font-size: 13px;
	}		
#border #view #center #center_table #grade_table #ques_table #instruct_table td.bottom
	{
		width: 550px;
		height: 10px;
		margin: 0px auto;
		padding: 0px 0px 10px 0px;
		float: left;
		text-align: center;
		background-image:url(../image/instruct_bottom.png);
		background-repeat: no-repeat;
	}	
	/* end of the instruction css*/
#border #view #center #center_table #grade_table #ques_table .top
	{
		width: 590px;
		height: 10px;
		margin: 0px 2px 0px 2px;
		padding: 0px;
		float: left;
		text-align: center;
		background-image:url(../image/ques_back_top.png);
		background-repeat: no-repeat;
	}
#border #view #center #center_table #grade_table #ques_table .center
	{
		width: 590px;
		margin: 0px 2px 0px 2px;
		padding: 0px;
		float: left;
		text-align: center;
		background-image:url(../image/ques_back_center.png);
		background-repeat: repeat-y;
	}	
#border #view #center #center_table #grade_table #ques_table .center #each
	{
		width: 590px;
		margin: 0px;
		padding: 0px;
		float: left;
		color: #0000FF;
		font-size: 13px;
		font-family: Arial, Helvetica, sans-serif;
	}
#border #view #center #center_table #grade_table #ques_table #space
	{
		float: left;
		height: 10px;
	}
#border #view #center #center_table #grade_table #ques_table .center #each .qno
	{
		width: 25px;
		margin: 0px;
		padding: 0px;
		text-align: center;
	}
#border #view #center #center_table #grade_table #ques_table .center #each .qaudio
	{
		width: 25px;
		margin: 0px;
		padding: 0px;
	}
#border #view #center #center_table #grade_table #ques_table .center #each .qname
	{
		width: 495px;
		margin: 0px;
		padding: 0px;
		text-align: left;
	}
#border #view #center #center_table #grade_table #ques_table .center #each .qname img{ margin-top: 5px; padding: 0px;}
#border #view #center #center_table #grade_table #ques_table .center #each #ans_table
	{
		float: left;
		width: 590px;
		margin: 0px;
		padding: 0px;
	}
#border #view #center #center_table #grade_table #ques_table .center #each #ans_table td
	{
		width: auto;
		height: auto;
		text-align: center;
		margin: 0px;
		padding: 0px 0px 0px 10px;
		float: none;
		font-family: Arial, Helvetica, sans-serif;
		font-size: 13px;
	}	
#border #view #center #center_table #grade_table #ques_table .center #each .tbox
	{
		width: 300px;
		height: 25px;
		border: 1px solid #006600;
	}	
#border #view #center #center_table #grade_table .button
	{
		padding: 5px; 
		cursor: pointer; 
	}
#border #view #center #center_table #grade_table td.error
	{
		width: 600px;
		margin: 0px;
		padding: 10px 0px 0px 0px; 
		color: #0000FF;  
		font-family: Arial, Helvetica, sans-serif; 
		font-size: 13px;
	}
#border #view #center #center_table #grade_table #ques_table .bottom
	{
		width: 590px;
		height: 10px;
		margin: 0px 2px 10px 2px;
		padding: 0px;
		float: left;
		text-align: center;
		background-image:url(../image/ques_back_bottom.png);
		background-repeat: no-repeat;
	}	
	/*end of center page css*/	
	
	/*start of right page css*/
#border #view #right
	{
		width: 200px;
		margin: 0px;
		padding: 0px;
	}
#border #view #right td.share
	{
		padding: 6px 0px 5px 0px;
		margin: 0px;
		float: left;
		width: 193px;
		background-color: #006600;
	}
#border #view #right td.options
	{
		padding: 5px 0px 5px 0px;
		margin: 0px;
		float: left;
		width: 185px;
		font-size: 13px;
		color: #006600;
		font-family: Arial, Helvetica, sans-serif;
	}
#border #view #right td.options .time
	{
		width: 50px;
		height: 25px;
		text-align: center;
		background-color: #E5FFCE;
		border: 1px solid #006600;
	}
#border #view #right #worksheets
	{
		width: 188px;
		float: left;
		margin: 10px 3px 0px 3px;
		padding: 0px;
		background-color: #006600;
		border: 1px solid #006600;
		font-size: 13px;
		color: #FFFFFF;
		font-family: Arial, Helvetica, sans-serif;
	}
#border #view #right #worksheets .text
	{
		width: 188px;
		float: left;
		padding: 0px;
		text-align: center;
		font-size: 13px;
		color: #FFFFFF;
		font-family: Arial, Helvetica, sans-serif;
		font-weight: bold;
	}	
#border #view #right .button
	{
		padding: 5px; 
		font-family: Arial, Helvetica, sans-serif;
		font-size: 12px;
		cursor: pointer; 
	}
#border #view #right .ansshare_button
	{
		padding: 5px; 
		width: 150px;
		height: 60px;
		font-family: Arial, Helvetica, sans-serif;
		font-size: 13px;
		color:#FFF;
		font-weight: bold;
		cursor: pointer; 
		background: #060;
		border: 1px solid #999;
	}
	/*end of right page css*/
	
.ques_hold{
	margin-bottom:20px;
	background-color:rgba(46,208,201,0.1);
	border-radius:10px;
	padding:15px;
	  -webkit-transition: all 0.5s ease-in-out;
  -moz-transition: all 0.5s ease-in-out;
  -o-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
}
.ques_hold:hover{
	background-color:rgba(46,208,201,0.3);
}
.qno, .qname{
	display:inline;
	line-height:22px;
}
.ans_hold{
	display:inline-block;
	margin-right:5px;
}

#ans_table ul li{
  display: inline-block;
  position: relative;
}

#ans_table ul li input[type=radio]{
  position: absolute;
  visibility: hidden;
}

#ans_table ul li label{
  display: block;
  position: relative;
  font-weight: 300;
  font-size: 14px;
  padding: 10px 0 10px 45px;
  margin: 10px auto;
  height: auto;
  z-index: 9;
  cursor: pointer;
  -webkit-transition: all 0.25s linear;
}

#ans_table ul li:hover label{
	color: #2ed0d4;
}

#ans_table ul li .check{
  display: block;
  position: absolute;
  border: 2px solid #333;
  border-radius: 100%;
  height: 25px;
  width: 25px;
  top: 15px;
  left: 10px;
	z-index: 5;
	transition: border .25s linear;
	-webkit-transition: border .25s linear;
}

#ans_table ul li:hover .check {
  border: 3px solid #2ed0d4;
}

#ans_table ul li .check::before {
  display: block;
  position: absolute;
	content: '';
  border-radius: 100%;
  height: 15px;
  width: 15px;
  top: 3px;
	left: 3px;
  margin: auto;
	transition: background 0.25s linear;
	-webkit-transition: background 0.25s linear;
}

#ans_table input[type=radio]:checked ~ .check {
  border: 2px solid #2ed0d4;
}

#ans_table input[type=radio]:checked ~ .check::before{
  background: #2ed0d4;
}

#ans_table input[type=radio]:checked ~ label{
  color: #2ed0d4;
}
#ans_table ul li.ans_hold.title_ques label{
	cursor:not-allowed !important;
}

.exam_instructions{
	background-color:rgba(46,208,201,0.2);
	padding:15px;
	margin-bottom:20px;
	border-radius:10px;
}
.exam_instructions ul li{
	margin-bottom:10px;
}
.exam_instructions h4{
	margin-bottom:15px;
	font-weight:bold;
}
.result_share{
	background-color:rgba(46,208,201,0.2);
	padding:15px;
	text-align:center;
	cursor:pointer;
	border-radius:10px;
}
.result_share img{
	width:100%;
}
.exam_timing span{
	display:block;
	font-size:16px;
	color:rgba(46,208,201,1);
	font-weight:bold;
	text-align:center;
	padding:15px 0;
}
.exam_time{
	text-align:center;
}
.exam_time input[type="text"]{
	display:inline;
	background-color:rgba(46,208,201,0.2);
	padding:10px 10px;
	border-radius:10px;
	color:#000;
	width:50px;
	border:1px solid rgba(46,208,201,1);
	margin:0 5px 20px 0;
	text-align:center;
	min-width:65px;
}
.smart_score{
	color:rgba(46,208,201,1);
	text-align:center;
	font-weight:bold;
}
.smart_score input[type="text"]{
	display:inline;
	background-color:rgba(46,208,201,0.2);
	padding:10px;
	min-width:65px;
	color:#000;
	width:50px;
	border:1px solid rgba(46,208,201,1);
	margin:0 5px 20px 0;
	text-align:center;
}
.exam_btns{
	text-align:center;
}

.exam_btns input[type="button"], .exam_btns input[type="submit"], #ques_table button[type="submit"], #ques_table input[type="button"]{
    color: rgba(255,255,255,1);
    text-decoration: none;
    background-color: #2ed0d4;
    display: inline-block;
    padding: 10px 20px;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
    -webkit-box-shadow: 0px 9px 0px rgba(41,168,171,1), 0px 9px 25px rgba(0,0,0,.4);
    -moz-box-shadow: 0px 9px 0px rgba(41,168,171,1), 0px 9px 25px rgba(0,0,0,.4);
    box-shadow: 0px 9px 0px rgba(41,168,171,1), 0px 9px 25px rgba(0,0,0,.4);
    margin-bottom: 25px;
	width: auto;
	text-align: center;
	border: none;
	
	-webkit-transition: all .1s ease;
	-moz-transition: all .1s ease;
	-ms-transition: all .1s ease;
	-o-transition: all .1s ease;
	transition: all .1s ease;
}


.exam_btns input[type="button"]:active, .exam_btns input[type="submit"]:active, #ques_table button[type="submit"]:active, #ques_table input[type="button"]:active {
    -webkit-box-shadow: 0px 3px 0px rgba(41,168,171,1), 0px 3px 6px rgba(0,0,0,.9);
    -moz-box-shadow: 0px 3px 0px rgba(41,168,171,1), 0px 3px 6px rgba(0,0,0,.9);
    box-shadow: 0px 3px 0px rgba(41,168,171,1), 0px 3px 6px rgba(0,0,0,.9);
    position: relative;
    top: 6px;
}

.exam_btns #worksheets{
	background-color:rgba(46, 208, 201, 0.2);
	margin-bottom:15px;
}
.exam_btns #worksheets input[type="button"], .exam_btns #worksheets  input[type="submit"] {
	box-shadow:0 5px 0 rgba(41, 168, 171, 1), 0 9px 25px rgba(0, 0, 0, 0.4);
	padding:5px 10px;
	margin-top:20px;
}
#ques_table .tbox{
	padding:7px;
	margin:13px 0;
	border:1px solid rgba(46,208,201,0.4);
	border-radius:10px;
}
.err_msg{
	width: 470px;
	text-align: center;
	margin-right:10px;
	margin-bottom: -10px;
}
.err_msg .wrong{
	margin-right:40px;
	margin-left:40px;
	margin-bottom: -20px;
	background: #ddd;
	border-radius: 12px;
    -webkit-box-shadow: 0px 2px 25px rgba(0,0,0,.4);
    -moz-box-shadow: 0px 2px 25px rgba(0,0,0,.4);
    box-shadow: 0px 2px 25px rgba(0,0,0,.4);
}
.img_check{
	top:65px !important;
}

#show input[type="text"]{
	display:inline;
	background-color:rgba(46,208,201,0.2);
	padding:10px;
	min-width:250px;
	color:#000;
	width:150px;
	border:1px solid rgba(46,208,201,1);
	margin:0 5px 20px 0;
	text-align:center;	
}

#show input[type="button"] {
    color: rgba(255,255,255,1);
    text-decoration: none;
    background-color: #2ed0d4;
    display: inline-block;
    padding: 10px 20px;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
    -webkit-box-shadow: 0px 9px 0px rgba(41,168,171,1), 0px 9px 25px rgba(0,0,0,.4);
    -moz-box-shadow: 0px 9px 0px rgba(41,168,171,1), 0px 9px 25px rgba(0,0,0,.4);
    box-shadow: 0px 9px 0px rgba(41,168,171,1), 0px 9px 25px rgba(0,0,0,.4);
    margin-bottom: 25px;
	width: auto;
	text-align: center;
	border: none;
	
	-webkit-transition: all .1s ease;
	-moz-transition: all .1s ease;
	-ms-transition: all .1s ease;
	-o-transition: all .1s ease;
	transition: all .1s ease;
}

#printsubmit input[type="submit"]{
    color: rgba(255,255,255,1);
    text-decoration: none;
    background-color: #2ed0d4;
    display: inline-block;
    padding: 10px 20px;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
    -webkit-box-shadow: 0px 9px 0px rgba(41,168,171,1), 0px 9px 25px rgba(0,0,0,.4);
    -moz-box-shadow: 0px 9px 0px rgba(41,168,171,1), 0px 9px 25px rgba(0,0,0,.4);
    box-shadow: 0px 9px 0px rgba(41,168,171,1), 0px 9px 25px rgba(0,0,0,.4);
    margin-bottom: 25px;
	width: auto;
	text-align: center;
	border: none;
	
	-webkit-transition: all .1s ease;
	-moz-transition: all .1s ease;
	-ms-transition: all .1s ease;
	-o-transition: all .1s ease;
	transition: all .1s ease;
}

/* ==== FOOTER ==== */

.footer{
	background-color:#45e7eb;
	padding:50px 0;
}
.footer h2{
	color:#000;
	font-size:16px;
	padding-bottom:20px;
	position:relative;
	margin-bottom:30px;
}
.footer h2::before{
	position:absolute;
	left:0px;
	bottom:0px;
	content:'';
	width:50px;
	height:2px;
	background-color:#000;
}
.footer p{
	color:#000;
	font-size:14px;
	line-height:20px;
	text-indent:80px;
	text-align:justify;
}
.footer .col-md-3 iframe{
	width:100% !important;
}
.footer input[type="text"],
.footer textarea{
	background-color:#fff;
	-webkit-box-shadow:2px 3px 0px #ccc;
	-moz-box-shadow:2px 3px 0px #ccc;
	-o-box-shadow:2px 3px 0px #ccc;
	box-shadow:2px 3px 0px #ccc;
	width:100%;
	border:none;
	padding:10px;
	border-radius:7px;
	margin-bottom:15px;
	color:#333;
	resize:vertical;
}
.footer input[type="text"]::-webkit-input-placeholder { /* WebKit, Blink, Edge */
    color:#333;
}
.footer input[type="text"]:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
   	color:#333;
   	opacity:1;
}
.footer input[type="text"]::-moz-placeholder { /* Mozilla Firefox 19+ */
   	color:#333;
   	opacity:1;
}
.footer input[type="text"]:-ms-input-placeholder { /* Internet Explorer 10-11 */
   	color:#333;
}
.footer textarea::-webkit-input-placeholder { /* WebKit, Blink, Edge */
    color:#333;
}
.footer textarea:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
   	color:#333;
   	opacity:1;
}
.footer textarea::-moz-placeholder { /* Mozilla Firefox 19+ */
   	color:#333;
   	opacity:1;
}
.footer textarea:-ms-input-placeholder { /* Internet Explorer 10-11 */
   	color:#333;
}
.footer input[type="submit"]{
	background-color:#333;
	-webkit-box-shadow:2px 3px 0px #000;
	-moz-box-shadow:2px 3px 0px #000;
	-o-box-shadow:2px 3px 0px #000;
	box-shadow:2px 3px 0px #000;
	padding:10px;
	text-transform:uppercase;
	border:none;
	-webkit-border-radius:6px;
	-moz-border-radius:6px;
	-o-border-radius:6px;
	border-radius:6px;
	color:#fff;
	-webkit-transition: all 0.4s ease-in-out 0s;
	-moz-transition: all 0.4s ease-in-out 0s;
  	-o-transition: all 0.4s ease-in-out 0s;
  	transition: all 0.4s ease-in-out 0s;
}
.footer input[type="submit"]:focus{
	-webkit-box-shadow:none;
	-moz-box-shadow:none;
	-o-box-shadow:none;
	box-shadow:none;
}
#submitcenter2{
	width: 600px;
	float: left;
	text-align: center;
}
#submitcenter2 .button{
	margin-right: 50px;
}
.sub_footer{
	background-color:#404547;
	padding:20px 0;
	color:#fff;
}
.social_links ul{
	margin:0px;
	padding:0px;
}
.social_links ul li{
	display:inline-block;
	margin:0 0 10px 10px;
	min-width:118px;
}
.social_links ul li a{
	color:#000;
	font-family:tahoma;
	font-size:14px;
	font-weight:bold;
}
.social_links ul li a:hover{
	text-decoration:none;
}
.social_links ul li a .fa{
	background-color:#3b5998;
	color:#fff;
	width:40px;
	height:40px;
	line-height:40px;
	-webkit-border-radius:50%;
	-moz-border-radius:50%;
	-o-border-radius:50%;
	border-radius:50%;
	text-align:center;
	display:inline-block;
	vertical-align:middle;
	font-size:22px;
	-webkit-transition: all 0.4s ease-in-out 0s;
	-moz-transition: all 0.4s ease-in-out 0s;
  	-o-transition: all 0.4s ease-in-out 0s;
  	transition: all 0.4s ease-in-out 0s;
}
.social_links ul li:nth-child(2) a .fa{
	background-color:#55acee;
}
.social_links ul li:nth-child(3) a .fa{
	background-color:#00aff0;
}
.social_links ul li:nth-child(4) a .fa{
	background-color:#cd201f;
}
.social_links ul li:nth-child(5) a .fa{
	background-color:#dc4e41;
}
.social_links ul li:nth-child(6) a .fa{
	background-color:#062f3c;
}
.social_links ul li:nth-child(7) a .fa{
	background-color:#e3e0d3;
}
.social_links ul li:nth-child(8) a .fa{
	background-color:#a4c639;
}
.social_links ul li:nth-child(7) a .fa{
	color:#ea4335
}
.social_links ul li a:hover .fa{
	-webkit-transform: rotateZ(720deg);
    -moz-transform: rotateZ(720deg);
	-o-transform: rotateZ(720deg);
    transform: rotateZ(720deg);
}
.sub_footer p{
	font-size:13px;
	text-align:center;
	font-weight:bold;
}
.gmail_ico{
	background-image:url(../images/gmail.png);
	background-repeat:no-repeat;
	background-position:center;
	width:28px;
	height:20px;
}
#topbtn{
	position:fixed;
	right:15px;
	bottom:15px;
	background-color:#f98f6f;
	padding:10px 12px;
	color:#fff;
	z-index:15;
	font-size:20px;
	outline:none;
	display:none;
}
#error_time{
	z-index:2;
}
.carousel-control.left,
.carousel-control.right{
	background:none;
}
.carousel-control{
	opacity:1 !important;
}
.carousel-control .fa{
	width:40px;
	height:40px;
	background-color:#fff;
	-webkit-border-radius:50%;
	-moz-border-radius:50%;
	-o-border-radius:50%;
	border-radius:50%;
	line-height:40px;
	color:#333;
}

/*#show img{
	border:3px solid #000;
}*/

.ansshare_button{
	width:155px !important;
	white-space:normal;
	line-height:20px;
}

.syllabus_lesson{
	text-align:center;
	position:relative;
	margin-bottom:30px;
}
.syllabus_lesson figure img{
	background-color:#333;
	border-radius:15px;
}
.syllabus_lesson h3{
	font-size:12px;
	margin:0;
	padding:10px;
	position:absolute;
	top:inherit;
	left:0;
	right:0;
	bottom:1px;
	margin:0 auto;
	-moz-transform:translateY(0%);
	-webkit-transform:translateY(0%);
	-o-transform:translateY(0%);
	transform:translateY(0%);
	background-color:rgba(0,0,0,0.8);
	max-width:70%;
	color:#fff;
	border-radius:15px;
	line-height:17px;
	max-width:79.2%;
	border-radius:0 0 15px 15px;
}
/*.sy_lesson h3{
	top:inherit;
	bottom:1px;
	-moz-transform:translateY(0%);
	-webkit-transform:translateY(0%);
	-o-transform:translateY(0%);
	transform:translateY(0%);
	max-width:79.2%;	
	border-radius:0 0 15px 15px;
}*/
.syllabus_lesson h3 a{
	color:#fff;
}

.result_fixed{
	position:fixed;
	top:100px;
	width:263px;
}
