@import url(https://fonts.googleapis.com/css?family=Asap|Arimo|Titillium+Web);

/** CSS tags to use for toggling logged-in/not-logged-in screens on the same page **/
.no-login {
	display:none;
}

.user- {
	display: block;
}

.login-empty- {
	display:none;
}

/** Layout **/
body {
	background: url('../images/white_curtain/04_img1.png') !important;
}

div.scs_body {
	overflow:visible;
}

div.scs_info {
	background: none;
	color:#000;
}

div#scs_entire_page {
	width:1000px;
	margin:0 auto;
	float:none;
	clear:none;
	background: #fff;
	border:1px solid #eee;
	box-shadow: 0px 0px 3px #ddd;
	padding: 5px;
}

div.scs_footer {
	float:none;
	height:auto;
	padding:7px 0;
}

div.scs_left_body {
	display:none;
}

div.scs_center_body {
	width:100%;
	padding:0;
	font-family: Arimo !important;
}

div.scs_center_body > span {
	display: block;
}

div.scs_center_body > span, div.scs_center_body > p {
	padding:4px;
}

div.scs_header_separator, div.scs_footer_separator {
	display:none;
}

/** Inputs **/
input[type="text"], input[type="password"],select {
	border:1px solid #aaa;
	padding:2px 4px;
}

select {
	padding:2px;
}

input[type="text"]:focus, input[type="password"]:focus,select:focus {
	background:#C6EDF7;
	border-color:#2287BD;
}

input.scs_login_input {
    margin-right: 5px;
}

/** Buttons **/
button:enabled:not(.sprite-fc32),input[type="button"]:enabled:not(.sprite-fc32),input[type="submit"]:enabled:not(.sprite-fc32) {
	border:1px solid #bbb;
	background: -moz-linear-gradient(top,#fff 0%, #eee 50%, #ddd 51%, #eee 100%);
	background: -webkit-linear-gradient(top,#fff 0%, #eee 50%, #ddd 51%, #eee 100%);
	background: -ms-linear-gradient(top,#fff 0%, #eee 50%, #ddd 51%, #eee 100%);
	background: -o-linear-gradient(top,#fff 0%, #eee 50%, #ddd 51%, #eee 100%);
	-pie-background: linear-gradient(top,#fff 0%, #eee 50%, #ddd 51%, #eee 100%);
	padding:2px 4px;
	margin:1px;
	font-family: Arimo !important;
	font-weight: normal;
	color:#111 !important;
}

button:hover:enabled:not(.sprite-fc32),input[type="button"]:hover:enabled:not(.sprite-fc32),input[type="submit"]:hover:enabled {
	background: -moz-linear-gradient(top,#fff 0%, #CBE8F7 50%, #9EDDFF 51%, #CBE8F7 100%);
	background: -webkit-linear-gradient(top,#fff 0%, #CBE8F7 50%, #9EDDFF 51%, #CBE8F7 100%);
	background: -ms-linear-gradient(top,#fff 0%, #CBE8F7 50%, #9EDDFF 51%, #CBE8F7 100%);
	background: -o-linear-gradient(top,#fff 0%, #CBE8F7 50%, #9EDDFF 51%, #CBE8F7 100%);
	-pie-background: linear-gradient(top,#fff 0%, #CBE8F7 50%, #9EDDFF 51%, #CBE8F7 100%);
	border-color:#46AAE0;
	color:#111 !important;
}

button:active:enabled:not(.sprite-fc32),input[type="button"]:active:enabled:not(.sprite-fc32),input[type="submit"]:active:enabled {
	background: -moz-linear-gradient(top,#B1D1E3 0%, #A0D5F2 50%, #7EC1E6 51%, #A0D5F2 100%);
	background: -webkit-linear-gradient(top,#B1D1E3 0%, #A0D5F2 50%, #7EC1E6 51%, #A0D5F2 100%);
	background: -ms-linear-gradient(top,#B1D1E3 0%, #A0D5F2 50%, #7EC1E6 51%, #A0D5F2 100%);
	background: -o-linear-gradient(top,#B1D1E3 0%, #A0D5F2 50%, #7EC1E6 51%, #A0D5F2 100%);
	-pie-background: linear-gradient(top,#B1D1E3 0%, #A0D5F2 50%, #7EC1E6 51%, #A0D5F2 100%);
	border-color:#1D678F;
	font-weight: normal;
	color:#111 !important;
}

/** Navigation **/
div#scs_navigate {
	border-top:1px solid #ccc;
	border-bottom:1px solid #aaa;
	margin-bottom:0;
	background: -moz-linear-gradient(top,#fff 0%, #eee 50%, #ddd 51%, #eee 100%);
	background: -webkit-linear-gradient(top,#fff 0%, #eee 50%, #ddd 51%, #eee 100%);
	background: -ms-linear-gradient(top,#fff 0%, #eee 50%, #ddd 51%, #eee 100%);
	background: -o-linear-gradient(top,#fff 0%, #eee 50%, #ddd 51%, #eee 100%);
	-pie-background: linear-gradient(top,#fff 0%, #eee 50%, #ddd 51%, #eee 100%);
}

#nav > li:first-child {
	display:none;
}

#nav > li:last-child {
	display:none;
}

#nav li {
	border:none;
	border-left:1px solid #fff;
	border-right:1px solid #bbb;
}

#nav li a {
	color:#333;
	font-weight: normal;
	font-family: Asap, Helvetica;
}

#nav li a:hover {
	background: none;
	color:#333 !important;
}

#nav li:hover, #nav ul.submenu li:hover {
	background: -moz-linear-gradient(top,#fff 0%, #BEE4EE 50%, #B1D0DD 51%, #BEE4EE 100%);
	background: -webkit-linear-gradient(top,#fff 0%, #BEE4EE 50%, #B1D0DD 51%, #BEE4EE 100%);
	background: -ms-linear-gradient(top,#fff 0%, #BEE4EE 50%, #B1D0DD 51%, #BEE4EE 100%);
	background: -o-linear-gradient(top,#fff 0%, #BEE4EE 50%, #B1D0DD 51%, #BEE4EE 100%);
	-pie-background: linear-gradient(top,#fff 0%, #BEE4EE 50%, #B1D0DD 51%, #BEE4EE 100%);
	color:#333 !important;
}

#nav li:hover a {
	color:#333 !important;
}

#nav > li:nth-child(2) {
	border-left:none;
}

/** Submenu **/
#nav ul.submenu {
	border:none;
	margin-top:-3px;
	margin-left: -1px;
	box-shadow: 0px 2px 2px #aaa;
	background: url('../images/white_curtain/04_img2.png');
}

#nav ul.submenu li {
	height:auto;
	background: none;
	padding:0;
	width:100%;
}

#nav ul.submenu li a {
	background: none;
	padding:6px 2px;
}

#nav ul.submenu ul {
	margin-left:194px;
	margin-top:-33px;
}

/** Login banner **/
#login_banner {
	font-size:1.35em;
}

#login_banner strong {
	font-weight: normal;
}

/** Rounded divs **/
h3.new_scs_round_title {
	border:none;
	background: none;
	color:#000;
	padding:8px 8px;
	text-align: center;
	font-weight: normal;
	font-size:1.75em;
	border-bottom:1px solid #999;
}

div.new_scs_round_content {
	background: none;
	border:none;
	border-top:1px solid #fff;
}

div.new_scs_round {
	background: -moz-linear-gradient(top, rgba(255,255,255,0.5) 0%, rgba(255,255,255,0) 25%), url('../images/white_curtain/04_img3.png');
	background: -webkit-linear-gradient(top, rgba(255,255,255,0.5) 0%, rgba(255,255,255,0) 25%), url('../images/white_curtain/04_img3.png');
	background: -ms-linear-gradient(top, rgba(255,255,255,0.5) 0%, rgba(255,255,255,0) 25%), url('../images/white_curtain/04_img3.png');
	background: -o-linear-gradient(top, rgba(255,255,255,0.5) 0%, rgba(255,255,255,0) 25%), url('../images/white_curtain/04_img3.png');
	-pie-background: linear-gradient(top, rgba(255,255,255,0.5) 0%, rgba(255,255,255,0) 25%), url('../images/white_curtain/04_img3.png');
	box-shadow: 0px 0px 3px #666;
	border:1px solid #999;
}

/** COE **/
#ordentArea {
	border:none;
}

#ordentArea button {
	font-size:1.5em;
}

.goog-tab-bar {
	background: -moz-linear-gradient(top,#222,#777);
	background: -webkit-linear-gradient(top,#222,#777);
	background: -ms-linear-gradient(top,#222,#777);
	background: -o-linear-gradient(top,#222,#777);
	-pie-background: linear-gradient(top,#222,#777);
}

.goog-tab-bar .goog-rounded-tab table {
	width:100%;
}

.goog-tab-bar .goog-rounded-tab {
	width:16%;
	margin:0;
	text-align:center;
	display:inline-block;
}

.goog-rounded-tab .goog-rounded-tab-caption {
	background: -moz-linear-gradient(top,#3B72A9 0%, #2C5D8D 50%, #134679 51%, #2C5D8D 100%) !important;
	background: -webkit-linear-gradient(top,#3B72A9 0%, #2C5D8D 50%, #134679 51%, #2C5D8D 100%) !important;
	background: -ms-linear-gradient(top,#3B72A9 0%, #2C5D8D 50%, #134679 51%, #2C5D8D 100%) !important;
	background: -o-linear-gradient(top,#3B72A9 0%, #2C5D8D 50%, #134679 51%, #2C5D8D 100%) !important;
	-pie-background: linear-gradient(top,#3B72A9 0%, #2C5D8D 50%, #134679 51%, #2C5D8D 100%) !important;
}

.goog-rounded-tab-selected .goog-rounded-tab-caption {
	background: -moz-linear-gradient(top,#5B92C9 0%, #4C7DAD 50%, #336699 51%, #4C7DAD 100%) !important;
	background: -webkit-linear-gradient(top,#5B92C9 0%, #4C7DAD 50%, #336699 51%, #4C7DAD 100%) !important;
	background: -ms-linear-gradient(top,#5B92C9 0%, #4C7DAD 50%, #336699 51%, #4C7DAD 100%) !important;
	background: -o-linear-gradient(top,#5B92C9 0%, #4C7DAD 50%, #336699 51%, #4C7DAD 100%) !important;
	-pie-background: linear-gradient(top,#5B92C9 0%, #4C7DAD 50%, #336699 51%, #4C7DAD 100%) !important;
	box-shadow: 0px 0px 3px #fff inset;
}

.goog-rounded-tab-disabled .goog-rounded-tab-caption {
	background: -moz-linear-gradient(top,#DDD 0%, #BBB 50%, #999 51%, #BBB 100%) !important;
	background: -webkit-linear-gradient(top,#DDD 0%, #BBB 50%, #999 51%, #BBB 100%) !important;
	background: -ms-linear-gradient(top,#DDD 0%, #BBB 50%, #999 51%, #BBB 100%) !important;
	background: -o-linear-gradient(top,#DDD 0%, #BBB 50%, #999 51%, #BBB 100%) !important;
	-pie-background: linear-gradient(top,#DDD 0%, #BBB 50%, #999 51%, #BBB 100%) !important;
	color:#111;
}

.goog-rounded-tab-outer-edge, .goog-rounded-tab-inner-edge {
	display: none;
}

#editor_div fieldset, #ordentArea fieldset {
	border-width:0;
}

#editor_div .new_scs_round, #ordentArea .new_scs_round {
	width:100%;
	margin:5px 0;
	text-align: center;
}

#editor_div .new_scs_round .scs_center, #ordentArea .new_scs_round .scs_center {
	width:100% !important;
}

#editor_div .new_scs_round .scs_center textarea {
	width:100% !important;
}

.coe_package_box {
	float:none;
	position:relative;
	width:98%;
	text-align:left !important;
}

.coe_package_box h2.price {
	font-weight: bold;
	font-size:1.75em;
	font-family: Asap;
	position: absolute;
	top:5px;
	margin:4px;
	right:5px;
	padding:4px 9px;
	border:1px solid #777;
	border-bottom:none;
	background: -moz-linear-gradient(top,#f9f9f9,#d0d0d0);
	background: -webkit-linear-gradient(top,#f9f9f9,#d0d0d0);
	background: -ms-linear-gradient(top,#f9f9f9,#d0d0d0);
	background: -o-linear-gradient(top,#f9f9f9,#d0d0d0);
	-pie-background: linear-gradient(top,#f9f9f9,#d0d0d0);
	box-shadow: 0px -1px 2px #777;
	border-top-left-radius: 8px;
	border-top-right-radius: 8px;
	color:#777;
	text-shadow:0px -1px 0px #fff;
}

.coe_package_box .title1 {
	float:right;
	font-size:1.5em;
	text-decoration: underline;
}

.coe_package_box .title2 {
	float:right;
	font-size:1.25em;
	text-decoration: underline;
}

div.tabContent {
	width:auto;
}

/** COE Icons **/

div.coe_class_select {
    width: 450px;
    position: relative;
    padding: 5px;
    height: 32px;
    border: 1px solid #bbb;
    overflow: hidden;
    float: left;
    clear: both;
    margin: 4px;
    cursor:pointer;
    text-align: left;
    background: -moz-linear-gradient(top,#fff 0%, #eee 50%, #ddd 51%, #eee 100%);
    background: -webkit-linear-gradient(top,#fff 0%, #eee 50%, #ddd 51%, #eee 100%);
    background: -ms-linear-gradient(top,#fff 0%, #eee 50%, #ddd 51%, #eee 100%);
    background: -o-linear-gradient(top,#fff 0%, #eee 50%, #ddd 51%, #eee 100%);
    -pie-background: linear-gradient(top,#fff 0%, #eee 50%, #ddd 51%, #eee 100%);
    -webkit-transition: all 0.2s linear;
    -moz-transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    -ms-transition: all 0.2s linear;
    transition: all 0.2s linear;
}

div.coe_class_select .iconset {
    float: left;
    width: 450px;
}

div.coe_class_select .sprite-fc32 {
    float: left;
    margin-left: 5px;
    margin-right: 12px;
}

div.coe_class_select h2 {
    float: left;
    margin-top: 4px;
}

div.coe_class_select .goog-flat-menu-button {
    visibility: hidden;
    margin-top: -12px;
}

div.coe_class_select:hover {
   background: -moz-linear-gradient(top,#fff 0%, #BBDBF0 50%, #99CFF0 51%, #BBDBF0 100%);
   background: -webkit-linear-gradient(top,#fff 0%, #BBDBF0 50%, #99CFF0 51%, #BBDBF0 100%);
   background: -ms-linear-gradient(top,#fff 0%, #BBDBF0 50%, #99CFF0 51%, #BBDBF0 100%);
   background: -o-linear-gradient(top,#fff 0%, #BBDBF0 50%, #99CFF0 51%, #BBDBF0 100%);
   -pie-background: linear-gradient(top,#fff 0%, #BBDBF0 50%, #99CFF0 51%, #BBDBF0 100%);
   box-shadow: 0px 0px 3px #aaa;
}

div.coe_class_select:hover h2 {
	color:rgba(255,255,255,1);
	background: -moz-linear-gradient(top, rgba(100,100,100,1), rgba(100,100,100,0.65));
	background: -webkit-linear-gradient(top, rgba(100,100,100,1), rgba(100,100,100,0.65));
	background: -ms-linear-gradient(top, rgba(100,100,100,1), rgba(100,100,100,0.65));
	background: -o-linear-gradient(top, rgba(100,100,100,1), rgba(100,100,100,0.65));
	-pie-background: linear-gradient(top, rgba(100,100,100,1), rgba(100,100,100,0.65));
}

.goog-menu {
    border-radius: 5px;
}

.tnpicker_container > div {
	border:none;
	background: none;
}

.tnpicker_container {
	padding:4px;
	box-shadow: 0px 1px 2px #aaa inset;
	border:1px solid #bbb;
	margin:0 auto;
}

#ordentArea fieldset > div {
	box-shadow: 0px 0px 3px #888;
	background: -moz-linear-gradient(top,#fff 0%, #eee 5%, #ddd 95%, #ccc 100%);
	background: -webkit-linear-gradient(top,#fff 0%, #eee 5%, #ddd 95%, #ccc 100%);
	background: -ms-linear-gradient(top,#fff 0%, #eee 5%, #ddd 95%, #ccc 100%);
	background: -o-linear-gradient(top,#fff 0%, #eee 5%, #ddd 95%, #ccc 100%);
	-pie-background: linear-gradient(top,#fff 0%, #eee 5%, #ddd 95%, #ccc 100%);
	margin-top:12px;
	border-radius:8px;
}

#uploadtb {
	background: none;
	border:none;
}

/** Navigator icons **/
.scs_sprite {
	background-position: 0px 0px;
}

.scs_sprite.DBLLEFTARROW {
	background: url('../images/white_curtain/04_img4.png');
	width:16px;
	height: 16px;
}

.scs_sprite.DBLRIGHTARROW {
	background: url('../images/white_curtain/04_img5.png');
	width:16px;
	height: 16px;
}

.scs_sprite.ENDLEFTARROW {
	background: url('../images/white_curtain/04_img7.png');
	width:16px;
	height: 16px;
}

.scs_sprite.ENDRIGHTARROW {
	background: url('../images/white_curtain/04_img8.png');
	width:16px;
	height: 16px;
}

.scs_sprite.I_DBLLEFTARROW {
	background: url('../images/white_curtain/04_img9.png');
	width:16px;
	height: 16px;
}

.scs_sprite.I_DBLRIGHTARROW {
	background: url('../images/white_curtain/04_img10.png');
	width:16px;
	height: 16px;
}

.scs_sprite.I_ENDLEFTARROW {
	background: url('../images/white_curtain/04_img11.png');
	width:16px;
	height: 16px;
}

.scs_sprite.I_ENDRIGHTARROW {
	background: url('../images/white_curtain/04_img12.png');
	width:16px;
	height: 16px;
}

#coe_preview {
	box-shadow: 0px 0px 9px #fff;
	background: #fff;
	padding:4px;
}


/** Progress bar **/
.scs_progbar {
	border:1px solid #999 !important;
	box-shadow: 0px 1px 4px #999;
	font-family: Arimo !important;
	padding:8px 0;
	background: -moz-linear-gradient(top,rgba(255,255,255,0.5),rgba(255,255,255,0)), url('../images/white_curtain/04_img6.png');
	background: -webkit-linear-gradient(top,rgba(255,255,255,0.5),rgba(255,255,255,0)), url('../images/white_curtain/04_img6.png');
	background: -ms-linear-gradient(top,rgba(255,255,255,0.5),rgba(255,255,255,0)), url('../images/white_curtain/04_img6.png');
	background: -o-linear-gradient(top,rgba(255,255,255,0.5),rgba(255,255,255,0)), url('../images/white_curtain/04_img6.png');
	-pie-background: linear-gradient(top,rgba(255,255,255,0.5),rgba(255,255,255,0)), url('../images/white_curtain/04_img6.png');
}

.table_nav_icon {
  margin: 0px 5px 0px 5px;
}

@media screen and (min-width: 1280px) {
    #scs_entire_page,
    div.scs_body {
        min-width: 1256px;
    }

    div.scs_header,
    div.scs_footer,
    div.scs_info#login_banner_all,
    div.scs_center_body,
    div#scs_navigate {
        min-width: 1042px;
    }
}

@media screen and (min-width: 1600px) {
    #scs_entire_page,
    div.scs_body {
        min-width: 1576px;
    }

    div.scs_header,
    div.scs_footer,
    div.scs_info#login_banner_all,
    div.scs_center_body,
    div#scs_navigate {
        min-width: 1344px;
    }
}

@media screen and (min-width: 2048px) {
    #scs_entire_page,
    div.scs_body {
        min-width: 2024px;
    }

    div.scs_header,
    div.scs_footer,
    div.scs_info#login_banner_all,
    div.scs_center_body,
    div#scs_navigate {
        min-width: 1792px;
    }
}
