@charset "utf-8";

body > div.navbar.navbar-inverse.navbar-fixed-top > div > div.navbar-collapse.collapse { padding-right: 0; }

/*.dropdown-menu li:hover .sub-menu {visibility: visible;}*/
.dropdown-menu li:active , .dropdown-menu li:focus  { background: #27272B; }

/*.dropdown:hover .dropdown-menu {display: block;}*/
ul.nav li ul { min-width: 300px; }
ul.nav li ul.Course { width: 500px; }
ul.nav li ul li { width: 100%; transition: .20s linear; }

ul.nav li.dropdown > ul.dropdown-menu > li > ol { padding: 0 0 0 0px; }
ul.nav li.dropdown > ul.dropdown-menu > li > ol > li { width: 50%; height: 30px; line-height: 30px; float: left; overflow: hidden; padding: 0 20px; }
ul.nav li.dropdown > ul.dropdown-menu > li > ol > li > a { color: #FFF;  }

div.Partner ul li a { color: #FFF; font-size: 15px; }

div.UCOMLogo { line-height: 60px; }
div.UCOMLogo > a > img { height: 50px; }

li.Search { width: 240px;  }
li.Search div#element_courselookup .SearchArea { padding-top: 15px; }

/*選單背景*/
.dropdown-menu,
.navbar-inverse .navbar-nav > .open > a,
.navbar-inverse .navbar-nav > .open > a:hover,
.navbar-inverse .navbar-nav > .open > a:focus { background-color: #1F242B; border-left: solid #4A7B91 4px; }
.navbar-inverse .navbar-nav > li > a:hover { background-color: #4A7B91; color:#FFF; }

ul.nav li.dropdown > ul.dropdown-menu > li > ol > li:hover,
.dropdown-menu > li > a:hover,
.dropdown-menu > li > a:focus { background-color: #4A7B91; }


div.SearchArea { width: 700px; padding: 30px; }
div.SearchArea > div#element_courselookup input.SearchTextBOX,
div.SearchArea > div#element_courselookup .BTN_Search { 
	float: left; 
	height:50px !important; line-height:50px; 
	border-radius: 5px; border:0; 
	font-size: 1.5em; 
	text-shadow: none;
	font-family: 'Open Sans', Helvetica, Arial, 微軟正黑體, sans-serif; 
}

div.SearchArea > div#element_courselookup input.SearchTextBOX { padding: 5px 10px; margin: 0 1% 0 0; width: 79%; background: #FFF;}
div.SearchArea > div#element_courselookup input.SearchTextBOX:hover {  }

div.SearchArea > div#element_courselookup .BTN_Search { background: #4A7B91; width: 20%; color: #FFF; font-weight:300; }
div.SearchArea > div#element_courselookup .BTN_Search:hover { background: #096 }

div.navbar .Desktop { display: block; }
div.navbar .Mobile { display: none; }

/* Modal Content Mobile Device 當按下ICON就會出現搜尋方框 */

div#SearchModal .modal-content { border-radius: 10px; box-shadow: rgba(2,2,2,0.12) 0 0 50px 0; }
div#SearchModal .modal-dialog .modal-body { padding-top: 0; }
div#SearchModal .modal-dialog .modal-body > div#element_courselookup input,
div#SearchModal .modal-dialog .modal-body > div.BTN-Close { font-size: 1.5em; border-radius: 5px; border: none; height: 50px; width: 100%; clear: both;  }
div#SearchModal .modal-dialog .modal-body > div#element_courselookup { position: relative; }
div#SearchModal .modal-dialog .modal-body > div#element_courselookup input[type=text] { 
	margin: 8px 0; 
	padding: 0 10px; 
	border: solid 2px #EFEFED;

}
div#SearchModal .modal-dialog .modal-body > div.BTN-Close,
div#SearchModal .modal-dialog .modal-body > div#element_courselookup input[type=submit] { line-height: 50px; background: #CCC; color: #FFF; margin: 5px 0; text-align: center; }
div#SearchModal .modal-dialog .modal-body > div.BTN-Close { background: #999; }
div#SearchModal .modal-dialog .modal-body > div.BTN-Close:hover { cursor: pointer; background: #666; }
div#SearchModal .modal-dialog .modal-body > div#element_courselookup input[type=submit] { background: #b53e31; }
div#SearchModal .modal-dialog .modal-body > div#element_courselookup input[type=submit]:hover { background: #b75d20; }
div#SearchModal .modal-header { border: none !important; }
div#SearchModal .modal-header > h1 { text-align: center; font-weight: 600; color: #666; padding: 0 0 0 0; margin: 25px 0 0 0; }

/* Apply CSS to iOS affected versions only */
/* 修復iOS safari 輸入標的偏移問題 */
body.iosBugFixCaret.modal-open { position: fixed; width: 100%; }

	::-webkit-input-placeholder { /* WebKit browsers */
	    color:    #999;
	}
	:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
	    color:    #999;
	}
	::-moz-placeholder { /* Mozilla Firefox 19+ */
	    color:    #999;
	}
	:-ms-input-placeholder { /* Internet Explorer 10+ */
	    color:    #999;
	}

	@media screen and (min-width: 768px) {

	  div#SearchModal .modal-dialog {width: 500px; }

	}

	@media (max-width: 1200px) {
		ul.nav li.dropdown > ul.dropdown-menu > li > ol > li { width: 100%; float: none; padding: 0 40px; }
		div.SearchArea { padding: 0px; float: initial !important;  }
		div.SearchArea > div#element_courselookup{ clear: both; float: initial !important; padding: 10px; }
		div.SearchArea > div#element_courselookup input.SearchTextBOX { width: 65%; background: #FFF;}
		div.SearchArea > div#element_courselookup .BTN_Search { width: 30%; color: #FFF;}
		div.SearchArea > div#element_courselookup input.SearchTextBOX,
		div.SearchArea > div#element_courselookup .BTN_Search { height:40px !important; line-height:40px; font-size: 15px; }

		div.navbar .Desktop { display: none !important; }
		div.navbar .Mobile { display: block; }

		.navbar-header img { width:120px; }


	}

	@media (max-width: 1160px) {
		.navbar-inverse .navbar-nav > li > a { color: #FFF; font-size:14px; }
		
	}

	@media (max-width: 1128px) {
		li.smallScreen { display: none; }
		.navbar-inverse .navbar-nav > .open > a:focus,
		.navbar-inverse .navbar-nav > .open > a:hover { color:#FFF !important; }
		ul.nav li.dropdown > ul.dropdown-menu li a { font-size: 13px !important }

		body > div.navbar.navbar-inverse.navbar-fixed-top > div > div.navbar-collapse.collapse.in > ul { width: 100%;  }
		body > div.navbar.navbar-inverse.navbar-fixed-top > div > div.navbar-collapse.collapse.in > ul > li > ul { background: rgba(0,0,0,0.3); }

	}


	@media (max-width: 790px) {
		li.smallScreen { display: initial; }
		.navbar-header img { width:110px; }
	}

	/*Mobile Device Start*/
	@media (max-width: 599px) {
		ul.nav > li { border-bottom: solid 1px rgba(255,255,255,0.1); }
		ul.nav > li:nth-child(9) { border-bottom: 0; }
		ul.nav li, ul.nav li > a { font-size: 16px !important }
		ul.nav li.dropdown > ul.dropdown-menu li a { font-size: 14px !important }

	}