*{margin:0; font-family:"Century Gothic",'Century Gothic W01',Verdana,Arial,Helvetica;}
		body{background:#ebebeb; }
		.ribbon{min-height:180px; width:100%; background:# ; background-image: url(images/flairclass_001.jpg); position:absolute; top:200; display:block ; z-index:1; box-shadow: 1px 0 5px rgba(0,0,0,1.1);}
		.lorient{ min-height: 0px; width:100%; background:# ; background-image: url(images/flairclass_001.jpg); opacity:0.1; background-color: #6DB3F2; position:absolute; top:360; display:block ; z-index:1; bbox-shadow: 1px 0 5px rgba(0,0,0,1.1);}
		#scroll-bg {height:150px;background:url(images/flairclass_001.jpg);}   
#scroll-bg h2{color:#FFFFFF;padding:5px;}






	*{border:0}
		
		
		
		#main_wrapper{width:1050px; height:auto; margin:auto ; float: ; clearfix:auto; background:#d5d5ff; background:transparent ;  
		border:0px solid red; z-index:2;  position:relative ; display:table; bbox-shadow: 1px 0 5px rgba(0,0,0,1.1);}
		.contentregmarginbanner{background-image: url(images/bigbannermid.jpg); width:1000px; height:auto; display:table; padding:0; clearfix:auto;float:right}
		.contentregmarginbanner h1{ font-size:400%; padding:5%; padding-top:2%; color:#f8f8f8; text-shadow: 2px 2px 4px #000000;}
		.contentregmarginbanner h2{ font-size:200%; padding:5%; ppadding-bottom:0; color:#f8f8f8; text-shadow: 2px 2px 4px #000000;}
		.contentregmargin{width:1000px}
		.contentregmarginmoz{float:right; z-index:3}
		.rightinfobox{width:290px}
		.collapse{width: ; height: ; margin-left:40px; margin-right:40px; background:transparent; z-index:2;  position:relative ; display:block; }
		
		.celebration_n_major{z-index:-3}
		
		.ribbonin{min-height:180px; width:100%; bbox-shadow: 1px 1px 1px rgba(0,0,0,1.1); background:#5555ff; background:#afafe9; opacity:0.5; position:absolute; top:150; display:block ; z-index:1;}
		
		#leftbar{width:50px;  height:1px; clearfix:auto;  background: silver; position:relative; border:0px solid gray; margin-left: ; z-index:2; float:left;}
		#rightregion{width:1000px; min-height:auto; padding-bottom:0; background: ;position:relative; float:left; z-index:2; box-shadow: 1px 0 70px rgba(0,0,0,0.5);}
		.side{position:relative ; height:auto; ppadding:5%; top: ; background:transparent; margin-bottom:; }
		
		
	/* the side bullet*/
	    .side_bullet{background: ; height:auto; width:auto; clearfix:auto; position:absolute; top:0}
		.side_bullet_item{width:100%; height:auto;border-radius:20px; border-right:10px solid gray; background:#ebebeb; 
		margin-right:20px; box-shadow:rgb(110,110,110) 1px 3px 10px 3px;margin-top:; display:block; float:right}
	
	.side_bullet_item:hover{width:100%; border:0px dotted blue;  
		transition:width 300ms ease-in; background:none repeat scroll 0% 0% rgb(100, 100, 100); ffont-weight:bold;color:#fff;width:100%; border:0px dotted blue;   margin-right:50px;
		transition:width 300ms ease-in; padding:3%;}
		
	.site_menu_selected {width:100%; border:0px dotted blue;   margin-right:40px;
		transition:width 300ms ease-in; background:none repeat scroll 0% 0% rgb(100, 100, 100); ffont-weight:bold;color:#fff; padding:6%}
	.side_bullet_item h3{ text-align:left;  padding:3%; font-size:0.9em; padding-left:10px; margin-right:0px;}
		/* end of the side bullet*/	
		
		
		
.nav2{
	position:absolute;
	top:200px; 
	width:100%;
	height:auto; border-radius:10%;
	bborder:10px solid #d5d5ff;
	background:   ; right: 130; opacity:.3; font-weight:bold;
}

.ul{
	
	border-top: 1px dotted #9e9c9b;
	width:190px;
	height:auto;
	padding-left:40px;
	padding-top:0px;
	padding-bottom:10px;
	position:relative;
	color:brown;
}
.ul a {text-decoration:none;	padding-top:5px; width:100%; display:table-cell;position:relative;display:table-cell; top:100%; }
.ul:hover a {color:#fff;}
.ul:hover{
	background: #69c;
	color:#fff;
	text-decoration:none;
}
		
		/*content body or region both left and right*/
		
		
		#contentreg{width:100%; height:auto; clearfix:auto;  background:  ; margin-top:40px; z-index:1 }

		#leftcontent{width:570px; background:   ; z-index:1; float:left}
		#leftcontentat40{width:500px;}
		.main_feature{border-bottom: 3px solid silver;clearfix:auto; height:170px; margin-bottom:20px; padding-bottom:20px}
		.main_feature_image{width:290px; height:200px; background:  ; float:left; overflow:none }
		.main_feature_image img {width:100%; height:auto; max-width:100%;  ;}
		.main_feature_info{width:270px; height:200px; background:   ; float:left; margin-left:10px}
		.main_feature_info h3, p{padding:0; width:auto}
		
		.main_feature_info h3{font-size:180%; width:auto; padding-left:0; padding-right:0}
		
		.main_feature2{ width:500px; border-bottom: 0px solid silver;clearfix:auto; height:auto; padding-bottom:20px}
		.main_feature_image2{width:auto; height:auto; background: ; float:left; overflow:none; margin-bottom:1%}
		.main_feature_image2 img {width:500px; height:auto; max-width:100%;  ;}
		
		.halfpics_l{width:50%; float:left; border:0px solid red;}
		.halfpics_r{width:50%; float:right; border:0px solid red;}
		.halfpics_l img{width:99%; float:left;	}   .halfpics_r img{width:99%; float:right}  
		
		
		
		.oda_feature{border-bottom: 0px solid silver;clearfix:auto; height:230px; mmargin-top:20px;}
		.oda_feature_auto_ht{height:auto; margin-bottom:3%; margin-top:0; display:table;}
		.profilepicturesfront{    height: auto; padding-bottom: 5%; background: #f8f8f8; margin-top:3%; margin-bottom:3%;  border-left:35px solid #000080; width: auto; margin-left: -40px; padding: 6%;}
		.oda_feature_image{width:290px; height:auto; background: ; float:left; mmargin:10px; }
		.oda_feature_image img {width:100%; height:auto; }
		.oda_feature_info{width:270px; height:200px; background: transparent; float:right; float:left; margin-left:10px}
		.oda_feature_info h3 {font-size:180%; margin-top:40px} .oda_feature_info p{color:gray}
		
		
		/*all h1 and other fonts*/
		.aboutfrontp{color:gray;font-weight: }
		.aboutfront{font-weight:normal; font-size:auto; color:#59F;}
		.readmore{font-style:italic; color:red; font-weight:bold;text-decoration:none}
		.readmore a{color:red}
		.profiletopic{font-size:120%; font-weight:normal;margin-bottom:5%; color:#59F; color:#333; border-bottom:0px solid silver;}
		.stud_name{font-size:80%; font-style:italic; font-weight:bold}
		/*end of all h1 and other fonts*/
		
		
		.tinys{width:100px; height:100px; border-radius:30%}
		.zoom{position:absolute; width:0px; transition: width 0.3s linear 0s; z-index:1000}
		.tinys:hover + .zoom {width:300px; }
		
		
		
		.GHcookBK{width:40%; height:auto; transition: width 0.3s linear 0s; }
		.GHcookBK:hover{width:50%;transition: width 0.3s linear 0s;  }
		.GHcookBK_authors{position:absolute; width:0px; transition: width 0.3s linear 0s; z-index:1000}
		.GHcookBK:hover + .GHcookBK_authors {width:13%; }
		
		.buttons_frontabout{border:0px solid silver; padding:2%; width: ;float:right; opacity:0.2}
		 .areabutton_frontinfo{width:560px}
		.vids{width:100% ; height:auto; background:   ; margin: auto ; 0opacity:0.2}
		.buttons_frontabout:hover{width: ; height:auto; margin:; background: ; opacity:1}
		.vids_info{width:80px; float:left}
		.vids img{max-width:80px; height:auto; float:right; background:gray; 0opacity:0.9}
		.buttons_frontabout:hover img{max-width:80px; height:auto; float:right; background:gray; opacity:0.3}
		.vids h1{font-size:100%}
		
		
		.nav_button{ position: ; width:100%; height:auto;  background: background: -moz-linear-gradient(-45deg, rgba(202,219,234,1) 0%, rgba(202,219,234,0.85) 9%, rgba(202,219,234,0.34) 40%, rgba(202,219,234,0.81) 83%, rgba(202,219,234,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(-45deg, rgba(202,219,234,1) 0%,rgba(202,219,234,0.85) 9%,rgba(202,219,234,0.34) 40%,rgba(202,219,234,0.81) 83%,rgba(202,219,234,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(135deg, rgba(202,219,234,1) 0%,rgba(202,219,234,0.85) 9%,rgba(202,219,234,0.34) 40%,rgba(202,219,234,0.81) 83%,rgba(202,219,234,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cadbea', endColorstr='#cadbea',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */ ; border-radius:30%; ppadding-right:30px;padding-bottom:30px; padding-top:30px; left:100; float:right; height:auto;  float: ; margin-top:515; display:block;   }
		.navpull{height:90px; position:relative; right:-20; float:right; transition: all 0.4s ease-in; display:block;  bbox-shadow: 1px 0 70px rgba(0,0,0,0.5);}
		.navpull img{display:block; box-shadow: 1px 0 70px rgba(0,0,0,0.5);}
		.navpull:hover{ height:100; position:relative;  float:right; right:0; transition: all 0.1s ease-in;}
		
		
		#rightcontent{width:300px; padding-bottom:0; min-height:100px; background: transparent ;float:right; border-left:2px dotted silver}
		#rightcontent2{width:300px; mmax-width:26%; min-height:100px; background:   ;float:right; border-left:0px dotted silver}
		
		
			/*end of content body or region both left and right*/
		
		
		.rightinfobox{background: ; margin-left:10px; height:auto; margin-bottom:30px;  float:left; border-top:5px solid #ebebeb}
		.rightinfobox h2{width:; background:none; margin: ;font-size:1em; margin-bottom: 20px; padding:3%}
		/*.rightinfobox .p{width:50%; background: ; margin: auto; transition:width 0.5s linear 0s; }
		.authors{position:absolute; top:60; margin-left:200; margin-top:10px;}
		.authors li{list-style:none} 
		
		
		
		
		.rightinfobox:hover .p{width:40% ; background: ; margin-left:50; transition:width 5s linear 0s; }*/
		 .slider{width:80%}
		 .rightinfoboxmoz{border:0px solid #ebebeb}
		 /*side featres with info*/
		#news1_box{	float:left;	width:70px;	height:70px; background:#000099;	}
		#news1_box_info{width:210px; float:right; background: #f8f8f8 ; }
		#news1_box_info h3{	 width:auto; margin-left:10px;	}
		#news1_box_info a{text-decoration:none}
		#news1_box_info p{ width:auto; color:#333}
		 /* end of side featres with info*/		
		 
		  /*side featres with info*/
		#news1_box2{	float:left;	width:100px;	height:100px; background: ;	}
		#news1_box2 img{border-radius:100%; bbox-shadow: 1px 0 5px rgba(0,0,0,1.1);}
		#news1_box2:hover img{border-radius:100%; box-shadow: 1px 0 5px rgba(0,0,0,1.1);}
		#news1_box_info2{width:95%; display:block;  }
		
		#news1_box_info2 a{text-decoration:none}
		#news1_box_info2 p{ width:100%; padding:2.6%; color:gray; background:#fff}
		.rightinfobox2:hover #news1_box_info2 p{ width:100%; padding:2.6%; color:orange; font-weight:bold; background:#fff; transition:all 0.03s linear 0s;}
		#news1_box_info2 h2{ width:auto; padding:3%; color:gray; font-size:90%}
		.rightinfobox2{background: ; margin-left:10px; height:auto; margin-bottom:15px;  float:left; border-right:5px solid blue;  border-top:0px solid silver; border-bottom:0px solid silver; border-radius:40%}
		.comment{transition: all 0.4s ease-in;}
		.comment:hover{ border-bottom:0px solid gray; border-right:5px solid gray; transition: all 0.4s ease-in;}
		.commenter:hover{box-shadow: 1px 1px 1px rgba(0,0,0,1.1); }
		.rightInfo{font-size:150%}
		.rightinfobox2 h2{font-size:150%; font-weight:normal; margin-bottom:15px; }
		.name{color:#8800aa; font-weight:bold; font-size:120%; text-indent:10px}
		 /* end of side featres with info*/		
				
		
		.wrapin{width: ; height: ; margin-left:40px; margin-right:40px; background:transparent; z-index:2;  position:relative ; display:block; 
			bbox-shadow: 1px 0 5px rgba(0,0,0,1.1);}
		.homesliders{margin:0}
		.header_slide{  max-width:100%; margin:auto; background:# ; color:#fff; bbox-shadow: 1px 0 5px rgba(0,0,0,0.3);}
		.header_slide img{ height:auto; width:100%}
	
			
		#logoreg{min-height:100px; width:150px; background: }	
		.logo{position:absolute; top:0; bottom:0; left:0}
		#logoreg img{ max-width:100%; height:80px; padding:3%}
		.site_title{ position:absolute; left:120; background: ; max-width:100%; float:left; height:100px; padding:3%}
		.site_title h1{color:gray; font-size:1.9em; font-weight:normal; padding-top:3%}
		
		
		.main_feature_image  img:hover{box-shadow: 1px 0 5px rgba(0,0,0,1.1); }
		.oda_feature_image:hover{box-shadow: 1px 0 5px rgba(0,0,0,1.1); }
		.oda_feature_image:hover h4{box-shadow: 1px 0 5px rgba(0,0,0,1.1); }
		
		.lowericons{width:auto; list-style:none;float:left; margin-top:40px; background:  ; }
		.lowericons li{float:left; display:inline-block; margin-bottom:5%; opacity:0.5; font-size:80% }  
		.lowericons li img{ width:50px;  padding-bottom:3%; display:inline-block; margin-right:40px}
		.lowericons p{  background:; padding:0; margin:0}
		.wrapin2{width: ; height: ; padding-left:40px; padding-right:40px; background:transparent; z-index:2;  position:relative ; display:; 
			bbox-shadow: 1px 0 5px rgba(0,0,0,1.1);}
			.wrapin2 h1{padding:5% 0 0 2%; font-size:150%}
			.bottom_contact  {padding-top:30px}
		
		.lowericons li:hover  {opacity:1}
			.small_icon{ width:50px;}
		.big_icon{  position:absolute; width:0px; transition:width 0.3s linear 0s; z-index:10;opacity:0}
		
		.small_icon:hover + .big_icon {width:300px; opacity:1}
		
		
		
		.region3{width:100%; height:1500px; mmargin:0 auto; opacity:0.1; ffloat:right; mmargin-right:5%; background:red; z-index:2;  position:relative ; display:block; 
		bbox-shadow: 1px 0 5px rgba(0,0,0,1.1);}
		
		a{text-decoration: none; color:#5599ff}
		a:hover{text-decoration:underline}
		
		.forcollapse{margin:0; bbackground-image: url(images/flairclass_001.jpg); opacity:1;background: -moz-linear-gradient(45deg, rgba(177,216,245,0.5) 0%, rgba(253,255,255,0.45) 12%, rgba(230,248,253,0.37) 30%, rgba(196,231,249,0.1) 89%, rgba(190,228,248,0.1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(45deg, rgba(177,216,245,0.5) 0%,rgba(253,255,255,0.45) 12%,rgba(230,248,253,0.37) 30%,rgba(196,231,249,0.1) 89%,rgba(190,228,248,0.1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(45deg, rgba(177,216,245,0.5) 0%,rgba(253,255,255,0.45) 12%,rgba(230,248,253,0.37) 30%,rgba(196,231,249,0.1) 89%,rgba(190,228,248,0.1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#80b1d8f5', endColorstr='#1abee4f8',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */}
	

	@media screen and (max-width:1280px)  

 {
		 

		 
	}
		
		
		
		
	 @media screen and (max-width:1024px)  

 {
		 

		 
	}
		
	

		 @media screen and (max-width:800px)  

 {
		 
		}

		 
	}

	
		
		
		
		 @media screen and (max-width:768px)  /*still show the straight with info at sides where possible. remove side widget to bottom. give mainwrapper margin */

 {
		 

		 
	}
		
		
		
		@media screen and (max-width:480px)  

 {
		  
 

		 }
	
	@media screen and (max-width:320px)  

 {
	 

		 
	}