/*  * { box-sizing:border-box; }  */

body{

/*	background: #fafafa url(https://jackrugile.com/images/misc/noise-diagonal.png);*/
}

/* basic stylings ------------------------------------------ */
.container1 		{ 
  font-family:'Roboto';
  width:600px; 
  margin:30px auto 0; 
  display:block; 
  background:#FFF;
  padding:10px 50px 50px;
  box-shadow: 5px 10px 10px 5px rgba(0,0,0,0.5);
  border-radius:3px;
}
h2 		 { 
font-size:28px;
font-family:'Arial';
  text-align:center; 
  margin-bottom:0px; 
  color:#000066;
}


h3 {
	font-family: "Roboto", sans-serif;
    color:#0000000;
	font-size: 20px;
    
}

h4{
	font-size:20px;
 font-family: Verdana, sans-serif;
  margin-bottom:0px; 
  color:#335599;	
	
}

.icon_college{
	
	width:100px; 
	height:100px;
	
}
.icon_tree{
	
	width:30px;
	height:30px;
}
/*h2 small { 
  font-family: Verdana, sans-serif;
  font-weight:normal; 
  color:#888; 
  display:block; 
}
*/
.footer 	{ text-align:center; }
.footer a  { color:#53B2C8; }

/* form starting stylings ------------------------------- */
.group 			  { 
  position:relative; 
  margin-bottom:45px; 
  
}
input.form2 				{
  font-size:18px;
  border-radius:0px;
  padding:10px 10px 10px 5px;
  display:block;
  width:300px;
  border:none;
  border-bottom:1px solid #757575;
}


 select,input.form3 {
   font-family: "Roboto", sans-serif;
  outline: 0;
 /* background: #e6e6ff;*/
 background: #fffff1;
   border-radius: 5px;
  border: 1;
  margin: 0 0 5px;
  padding: 3px;
  box-sizing: border-box;
  font-size: 17px;
  text-align: center;
}


 input.form4 {
  font-family: "Roboto", sans-serif;
  outline: 0;
  background:#6699ff;
   border-radius: 5px;
  border: 0;
  margin: 0 0 0px;
  padding: 0px;
  box-sizing: border-box;
  font-size: 22px;
  color:#FFFFFF;
  text-align: center;
  width:auto;
  size:auto;
}

input.form4[type="text"]:disabled {
  background: #6699ff;
}
input:focus 		{ outline:none; }

/* LABEL ======================================= */
label 				 {
  color:#999; 
  font-size:18px;
  font-weight:normal;
  position:absolute;
  pointer-events:none;
  right:100px;
  top:10px;
  transition:0.2s ease all; 
  -moz-transition:0.2s ease all; 
  -webkit-transition:0.2s ease all;
}

/* active state */
input:focus ~ label, input:valid ~ label 		{
  top:-20px;
  font-size:14px;
  color:#5264AE;
}

/* BOTTOM BARS ================================= */
.bar 	{ position:relative; display:block; width:300px; }
.bar:before, .bar:after 	{
  content:'';
  height:2px; 
  width:0;
  bottom:1px; 
  position:absolute;
  background:#5264AE; 
  transition:0.2s ease all; 
  -moz-transition:0.2s ease all; 
  -webkit-transition:0.2s ease all;
}
.bar:before {
  left:50%;
}
.bar:after {
  right:50%; 
}

/* active state */
input:focus ~ .bar:before, input:focus ~ .bar:after {
  width:50%;
}

/* HIGHLIGHTER ================================== */
.highlight {
  position:absolute;
  height:60%; 
  width:100px; 
  top:25%; 
  left:0;
  pointer-events:none;
  opacity:0.5;
}

/* active state */
input:focus ~ .highlight {
  -webkit-animation:inputHighlighter 0.3s ease;
  -moz-animation:inputHighlighter 0.3s ease;
  animation:inputHighlighter 0.3s ease;
}

/* ANIMATIONS ================ */
@-webkit-keyframes inputHighlighter {
	from { background:#5264AE; }
  to 	{ width:0; background:transparent; }
}
@-moz-keyframes inputHighlighter {
	from { background:#5264AE; }
  to 	{ width:0; background:transparent; }
}
@keyframes inputHighlighter {
	from { background:#5264AE; }
  to 	{ width:0; background:transparent; }
}













/*top2*/

.top{
	
position: absolute;
  
  top: 150px;'
	
}



.alignleft {
	float: left;
}
.alignright {
	float: right;
}






h1 {
	font-family:Arial;
	width: 100%;
        font-size: 37px;
      margin: 0px ;
        text-align: center;
        color:#000066;
        text-shadow: 0px 1px 1px #f2f2f2,
                     0px 2px 1px #f2f2f2,
                     0px 3px 1px #f2f2f2,
                     0px 3px 1px #f2f2f2,
                     0px 4px 1px #6600ff,
                     0px 2px 1px #6600ff,
                     0px 5px 1px #6600ff,
                     0px 8px 3px rgba(100, 100, 100, 0.4),
                     0px 9px 5px rgba(100, 100, 100, 0.1),
                     0px 10px 7px rgba(100, 100, 100, 0.15),
                     0px 11px 9px rgba(100, 100, 100, 0.2),
                     0px 12px 11px rgba(100, 100, 100, 0.25),
                     0px 13px 15px rgba(100, 100, 100, 0.3);
     transition:all .8s ease-in-out;  
      -o-transition:all .8s ease-in-out;  
      -moz-transition:all .8s ease-in-out;  
      -webkit-transition:all .8s ease-in-out;
}


@media print
{
.normal {display:none;}
}





/*أطار ابيض */

.title{
  width:1100px;
  height: auto;
  vertical-align: middle;
 background:#ffffff;
  border-radius: 30px;
  box-shadow: 0 3px 5px rgba(0,0,0,0.9);
 
    transform-style: preserve-3d;
	
}




/* جدول حجم عادي */
table.table1 {
   /* border-collapse: collapse;*/
    
}

th, td {
    text-align: center;
    padding-top: 3px;
	 padding-bottom: 3px;
	/*font-size:18px;*/
}

/*tr:nth-child(even){background-color: #f2f2f2}*/


tr:nth-child(even){background-color: #f2f2f2;

input[type="text"]{

  background-color : #f2f2f2; 

}
}
th {
    background-color:#335599;
    color: white;
	
	input[type="text"]{

  background-color : #335599; 
  color:white;

}
	
	
}



/*Button*/

.button {
  padding: 10px 30px;
  font-size: 24px;
  text-align: center;
  cursor: pointer;
  outline: none;
  color: #fff;
  background-color: #660066;
  border: none;
  border-radius: 5px;
  box-shadow: 0 5px 15px #999;
}

.button:hover {background-color: #c1f0f0;
color:#006666;}

.button:active {
  background-color: #3e8e41;
  
  box-shadow: 0 5px #666;
  transform: translateY(4px);
}

.button:disabled  {
  background-color: #FFCCFF;
  
  box-shadow: 0 5px #666;
  transform: translateY(4px);
}




/* show slide and drop dawon*/


la {
display: inline-block;
    position:relative;
    padding-left:30px;
	 padding-right:30px;
	
}


input.form1{
	color:blue;
	text-align:center;
	border:0px;
	border-radius:3px;
	
}
input.form1[type="text"]:disabled {
  background: #ffffff;
}



* {box-sizing: border-box}
body {font-family: Verdana, sans-serif; margin:0}
.mySlides {display: none}


/* Slideshow container */
.slideshow-container {
	background-image:linear-gradient(to bottom, rgba(245, 246, 252, 0.15), rgba(117, 19, 93, 0.50)),
	url("../uinv3.jpg");
	box-shadow: 5px 10px 30px 5px rgba(0,0,0,0.5);
	border-radius:5px;
	 background-color: #04B4AE;
  max-width: 1000px;
  height: 280px;
  position: relative;
  margin: auto;
}

/* Next & previous buttons */
.prev, .next {
  cursor: pointer;
  position: absolute;
  top: 50%;
  width: auto;
  padding: 16px;
  margin-top: -22px;
  color: white;
  font-weight: bold;
  font-size: 18px;
  transition: 0.6s ease;
  border-radius: 0 3px 3px 0;
  user-select: none;
}

/* Position the "next button" to the right */
.next {
	 left: 0;
  
  border-radius: 3px 0 0 3px;
}

.prev {
 right: 0;
  
}

/* On hover, add a black background color with a little bit see-through */
.prev:hover, .next:hover {

  background-color: rgba(0,0,0,0.8);
}

/* Caption text */
.text {
  color: #f2f2f2;
  font-size: 15px;
  padding: 8px 12px;
  position: absolute;
 /* bottom: 8px;*/
  width: 100%;
  text-align: center;
}

/* Number text (1/3 etc) */
.numbertext {
	
  color: #f2f2f2;
  font-size: 12px;
  padding: 8px 12px;
  position: absolute;
  top: 0;
}

/* The dots/bullets/indicators */
.dot {
  cursor: pointer;
  height: 15px;
  width: 15px;
  margin: 0 2px;
  background-color: #bbb;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
}

.active, .dot:hover {
  background-color: #717171;
}

/* Fading animation */
.fade {
	
  -webkit-animation-name: fade;
  -webkit-animation-duration: 1.5s;
  animation-name: fade;
  animation-duration: 1.5s;
}

@-webkit-keyframes fade {
  from {opacity: .4} 
  to {opacity: 1}
}

@keyframes fade {
  from {opacity: .4} 
  to {opacity: 1}
}

/* On smaller screens, decrease text size */
@media only screen and (max-width: 300px) {
  .prev, .next,.text {font-size: 11px}
}






/*dropdown*/
.dropbtn {
  text-align: center;
  cursor: pointer;
  outline: none;
  padding:0px;
  margin:0px;
  color: none;
  width:100px;
  height:100px;
  background-color: #f2f2f2;
  border: none;
 border-radius:100%;
 display:inline;
}


.dropdown {
	
  position: relative;
  display: inline-block;
 padding:0px;
}

.dropdown-content {
  height:200px;
  overflow:auto;
  display: none;
  position: absolute;
  background-color: #f9f9f9;
  min-width: 220px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
}

.dropdown-content a {
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
}

.dropdown-content a:hover {background-color: #f1f1f1}

.dropdown:hover .dropdown-content {
  display: block;
}

.dropdown:hover .dropbtn {
  background-color: #f1f1f1;
}


/*--------------------------------------------------------------------------*/




/* Header Style الدعاية */
.codrops-top {
	line-height: 12px;
	font-size: 8px;
	background: #fff;
	background: rgba(255, 255, 255, 0.8);
	text-transform: uppercase;
	z-index: 9999;
	position: relative;
	font-family: Cambria, Georgia, serif;
	box-shadow: 1px 0px 2px rgba(0,0,0,0.2);
}

/* Clearfix hack by Nicolas Gallagher: http://nicolasgallagher.com/micro-clearfix-hack/ */

.codrops-top:before,
.codrops-top:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}

.codrops-top:after {
    clear: both
}

.codrops-top a {
	padding: 0px 10px;
	letter-spacing: 1px;
	color: #333;
	display: inline-block;
}

.codrops-top a:hover {
	background: rgba(255,255,255,0.6);
}

.codrops-top span.right {
	float: right;
}

.codrops-top span.right a {
	float: left;
	display: block;
}

/* Demo Buttons Style */
.codrops-demos {
    text-align:center;
	display: block;
	line-height: 30px;
	padding: 5px 0px;
}

.codrops-demos a {
    display: inline-block;
	margin: 0px 4px;
	padding: 0px 6px;
	color: #8c8c8c;
	line-height: 20px;	
	font-size: 12px;
	font-weight: 700;
	text-shadow: 1px 1px 1px #fff;
	border: 1px solid #fff;
	background: #ffffff; /* Old browsers */
	background: -moz-linear-gradient(top, #ffffff 0%, #f6f6f6 47%, #ededed 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(47%,#f6f6f6), color-stop(100%,#ededed)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #ffffff 0%,#f6f6f6 47%,#ededed 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #ffffff 0%,#f6f6f6 47%,#ededed 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, #ffffff 0%,#f6f6f6 47%,#ededed 100%); /* IE10+ */
	background: linear-gradient(top, #ffffff 0%,#f6f6f6 47%,#ededed 100%); /* W3C */
	box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
}

.codrops-demos a:hover {
	color: #333;
	background: #fff;
}

.codrops-demos a:active {
	background: #fff;
}

.codrops-demos a.current-demo,
.codrops-demos a.current-demo:hover {
	background: #555;
	border-color: #555;
	color: #ddd;
	text-shadow: 0 1px 1px rgba(0,0,0,0.5);
	box-shadow: 0 1px 0 rgba(255,255,255,0.2), inset 0 1px 1px rgba(0,0,0,0.5);
}

.support-note span{
	color: #ac375d;
	font-size: 16px;
	display: none;
	font-weight: bold;
	text-align: center;
	padding: 5px 0;
}

/*no print*/	
@media print
{
.noprint {display:none;}
}
 @page { margin: 0; }
/*print hidden*/
@media print 
{
  a[href]:after { content: none !important; }
  img[src]:after { content: none !important; }
}