@charset "utf-8"; /* Simple fluid media Note: Fluid media requires that you remove the media's height and width attributes from the HTML http://www.alistapart.com/articles/fluid-images/ */ img, object, embed, video { max-width: 100%; } /* IE 6 does not support max-width so default to width 100% */ .ie6 img { width:100%; } /* Dreamweaver Fluid Grid Properties ---------------------------------- dw-num-cols-mobile: 6; dw-num-cols-tablet: 8; dw-num-cols-desktop: 12; dw-gutter-percentage: 25; Inspiration from "Responsive Web Design" by Ethan Marcotte http://www.alistapart.com/articles/responsive-web-design and Golden Grid System by Joni Korpi http://goldengridsystem.com/ */ h1, h2, h3, h4 { font-weight: normal; } h1 { font-family:Arial, Helvetica, sans-serif; font-size: 30px; text-transform: uppercase; color: #8b0304; } h2 { font-family:Arial, Helvetica, sans-serif; font-size: 18px; color: #8b0304; text-transform: uppercase; } h3 { font-family:Arial, Helvetica, sans-serif; font-size: 14px; color: #8b0304; text-transform: uppercase; } h4 { font-family:Arial, Helvetica, sans-serif; font-size:12px; text-transform:uppercase; color: #8b0304; } h8 { font-family:Arial, Helvetica, sans-serif; font-size: 16px; color: #8b0304; text-transform: uppercase; text-align:right; display:inline-block; } p { text-align:justify; line-height: 20px; } .readMoreLink, a:visited { text-decoration:none; color:#900; } /* Mobile Layout: 480px and below. */ img.bg { min-height:100%; min-width:1024px; width:100%; height: auto; position:fixed; right:0px; z-index:-1; } .gridContainer { margin-left: auto; margin-right: auto; width: 87.9666%; padding-left: 1.5166%; padding-right: 1.5166%; background-image:url(../img/bgshadow.png); background-size: contain; } #header { clear: both; float: left; margin-left: 0; width: 100%; display: block; background-image:url(../img/Header%20bg.png); } #logo { clear: both; float: left; margin-left: 8px; width: 23%; display: block; text-align: center; } #maintitle { clear: both; float: left; margin-left: 78px; margin-top: -71px; width: 60%; display: block; text-align:center; } .fontsize{ padding-bottom:5px; padding-right:0px; padding-left:10px; } #emailcontainer { clear: both; float: left; margin-left: 4px; padding-top: 32px; width: 100%; display: block; /* text-align: center; */ color: #933; height: 50px; } #socialicon { clear: both; float: left; margin-left: 0; width: 100%; display: block; text-align:center; } #socialicon ul li { text-decoration:none; display:inline; } #socialicon ul li a img { padding: 0 10px 0 0px; } #main_nav { clear: both; float: right; margin-left: 0; width: 100%; display: block; } #homebtn:hover{ opacity:0.6; } #imgSlider { clear: both; float: left; margin-left: 0; width: 100%; display: block; } #usefulLinks { clear: both; float: left; margin-left: 0; width: 100%; display: block; background-image:url(../img/Header%20bg.png); text-decoration:none; } #usefulLinks li{ text-decoration:none; list-style-type: none; } #usefulLinks h8 { visibility:hidden; } #mainbodyContainer { clear: both; float: left; margin-left: 0; width: 100%; display: block; } #Column1 { clear: both; float: left; margin-left: 0; width: 100%; display: block; padding-left:5px; } .headingsep { padding-top:9px; padding-bottom: 10px; border-bottom:2px solid #900; } #aboutcontainer { clear: both; float: left; margin-left: 0; width: 100%; display: block; } #eventscontainer { clear: both; float: left; margin-left: 0; width: 100%; display: block; } #eventsdatecontainer { clear: both; float: left; margin-left: 0; width: 100%; display: block; } #eventsheading { clear: both; float: left; margin-left: 0; width: 100%; display: block; } #eventscontent { clear: both; float: left; margin-left: 0; width: 100%; display: block; } #sponsorContainer { clear: both; float: left; margin-left: 0; width: 100%; display: block; } #Column2 { clear: both; float: left; margin-left: 0; width: 100%; display: block; padding-right:5px; } #newsContainer { clear: both; float: left; margin-left: 0; width: 107%; display: block; text-align:center; } .vticker{ clear: both; float: left; margin-left: 0; width: 100%; display: block; padding:0px; } .vticker ul{ clear: both; float: left; margin-left: 0; width: 100%; display: block; padding:0px; } .vtickerlist { text-decoration:none; margin:0; clear:both; list-style-type: none; } .newssep { clear: both; float: left; margin-left: 0; width: 100%; display: block; border-bottom:1px solid #fff; padding-top:0px; padding-bottom:0px; } #newssep4 { border-bottom:none; } #imgthumnil { clear: both; float: left; margin-left: 0; width: 110%; height: auto; display: block; text-align:center; } #newscontent { clear: both; float: left; margin-left: 0; width: 100%; display: block; } #newsdate { clear: both; float: left; margin-left: 0; width: 100%; display: block; } #newsheading { clear: both; float: left; margin-left: 0; width: 100%; display: block; } #newsdetails { clear: both; float: left; margin-left: 0; width: 100%; display: block; } .newspopup{ text-align:center; } #sidebarcontainer { clear: both; float: left; margin-left: 0; width: 100%; display: block; } #sidebarsep01 { clear: both; float: left; margin-left: 0; width: 100%; display: block; } #sidebarsep02 { clear: both; float: left; margin-left: 0; width: 100%; display: block; } #EventsCalender { clear: both; float: left; margin-left: 0; width: 100%; display: block; } #sidebtn { clear: both; float: left; margin-left: 0; width: 100%; display: block; } #sidebtn a{ color:#FC0; } #joinacobauaebtn { text-align: center; height: 50px; background-color: #8b0304; margin-bottom: 5px; margin-top: 0px; border: 2px solid #FC0; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; padding-top: 10px; padding-right: 0px; padding-bottom: 5px; padding-left: 0px; } #joinacobauaebtn a:hover { color:#FFF; } #joinacobauaebtn:hover { background: #600; } #Directory { text-align:center; height: 50px; padding: 10px 0px 5px 0px; background-color:#8b0304; margin-bottom: 5px; border: 2px solid #FC0; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px } #Directory a:hover { color:#FFF; } #Directory:hover { background: #600; } #Downloads{ text-align:center; height: 50px; padding: 10px 0px 5px 0px; background-color:#8b0304; margin-bottom: 5px; border: 2px solid #FC0; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px } #Downloads a:hover { color:#FFF; } #Downloads:hover { background: #600; } #suggestionbtn{ text-align:center; height: 50px; padding: 10px 0px 5px 0px; background-color:#8b0304; margin-bottom: 5px; border: 2px solid #FC0; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px } #suggestionbtn a:hover { color:#FFF; } #suggestionbtn:hover { background: #600; } #photogallery { clear: both; float: left; margin-left: 0; width: 100%; display: block; } #photogallery:hover{ opacity:0.6; } #videogallery { clear: both; float: left; margin-left: 0; width: 100%; display: block; } #footerContainer { clear: both; float: left; margin-left: 0; width: 100%; display: block; background-image: url(../img/footerbkg.png); border-top:5px solid #8b0304; } #footernav { clear: both; float: left; margin-left: 0; width: 100%; display: block; color:#8b0304; } #footernav ul li { text-decoration:none; list-style-type: none; } #footernav a { color:#8b0304; } #footerCopyrightContainer{ clear: both; float: left; margin-left: 0; width: 100%; display: block; } #footerCopyrightContainer p { padding-left: 40px; text-align:center; } .footerbreak { visibility:hidden; } /* Tablet Layout: 481px to 768px. Inherits styles from: Mobile Layout. */ @media only screen and (min-width: 481px) { .gridContainer { width: 90.675%; padding-left: 1.1625%; padding-right: 1.1625%; } #header { clear: both; float: left; margin-left: 0; width: 100%; display: block; } #logo { clear: both; float: left; margin-left: 0; width: 35%; display: block; text-align:center; } #maintitle { clear: none; float: left; margin-left: 1%; width: 61.5384%; display: block; text-align:center; padding-top:50px; } #emailcontainer { clear: none; float: left; margin-left: 1%; width: 61.5384%; display: block; text-align: center; } #socialicon { clear: none; float: left; margin-left: 1%; width: 61.5384%; display: block; } #main_nav { clear: both; float: left; margin-left: 0; width: 100%; display: block; } #homebtn{ width:72px; text-align:center; padding:2px 0px; } #homebtn:hover{ opacity:0.6; } #acoba-uaebtn{ width:123px; text-align:center; padding:2px 0px; } #acoba-uaebtn:hover{ opacity:0.6; } #collegeprofilebtn{ width:164px; text-align:center; padding:2px 0px; } #collegeprofilebtn:hover{ opacity:0.6; } #eventsbtn{ width:91px; text-align:center; padding:2px 0px;; } #eventsbtn:hover{ opacity:0.6; } #newsbtn{ width:90px; text-align:center; padding:2px 0px; } #newsbtn:hover{ opacity:0.6; } #gallerybtn{ width:97px; text-align:center; padding:2px 0px; } #gallerybtn:hover{ opacity:0.6; } #contactusbtn{ width:125px; text-align:center; padding:2px 0px; } #contactusbtn:hover{ opacity:0.6; } #imgSlider{ clear: both; float: left; margin-left: 0; width: 100%; display: block; } #usefulLinks{ clear: both; float: left; margin-left: 0; width: 100%; display: block; } #usefulLinks h8 { visibility:inherit; } #usefulLinks ul li { display:inline; } #usefulLinks a{ text-decoration:none; padding:10px; color:#930; } #pointerhidden{ cursor:default; } #mainbodyContainer{ clear: both; float: left; margin-left: 0; width: 100%; display: block; } #Column1{ clear: both; float: left; margin-left: 0; width: 48.7179%; display: block; } #aboutcontainer{ clear: both; float: left; margin-left: 0; width: 100%; display: block; } #eventscontainer{ clear: both; float: left; margin-left: 0; width: 100%; display: block; } #eventsdatecontainer{ clear: both; float: left; margin-left: 0; width: 100%; display: block; } #eventsheading{ clear: both; float: left; margin-left: 0; width: 100%; display: block; } #eventscontent{ clear: both; float: left; margin-left: 0; width: 100%; display: block; } #sponsorContainer{ clear: both; float: left; margin-left: 0; width: 100%; display: block; } #Column2{ clear: none; float: left; margin-left: 2%; width: 47%; display: block; } #newsContainer{ clear: both; float: left; margin-left: 0; width: 107%; display: block; text-align:left; } .newssep{ clear: both; float: left; margin-left: 0; width: 100%; display: block; text-align:left; } #imgthumnil{ clear: both; float: left; margin-left: 0; width: 40%; height: auto; display: block; } #newscontent{ clear: none; float: left; margin-left: 2.5641%; width: 55%; display: block; } #newsdate{ clear: none; float: left; margin-left: 2.5641%; width: 100%; display: block; } #newsheading{ clear: both; float: left; margin-left: 0; width: 100%; display: block; } #newsdetails{ clear: both; float: left; margin-left: 0; width: 100%; display: block; } #sidebarcontainer{ clear: both; float: left; margin-left: 0; width: 100%; display: block; padding-left:5px; } #sidebarsep01 { clear: both; float: left; margin-left: 0; width: 48.7179%; display: block; } #sidebarsep02 { clear: none; float: left; margin-left: 2.5641%; width: 48.7179%; display: block; } #EventsCalender{ clear: both; float: left; margin-left: 0; width: 100%; display: block; } #sidebtn{ clear: both; float: left; margin-left: 0; width: 100%; display: block; } #photogallery{ clear: both; float: left; margin-left: 0; width: 100%; display: block; } #videogallery{ clear: both; float: left; margin-left: 0; width: 100%; display: block; } #footerContainer{ clear: both; float: left; margin-left: 0; width: 100%; display: block; text-align:left; } #footernav{ clear: both; float: left; margin-left: 0; width: 100%; display: block; } #footernav ul li { text-decoration:none; list-style-type: none; display:inline; } #footernav a { color:#8b0304; } #footerCopyrightContainer{ clear: both; float: left; margin-left: 0; width: 100%; display: block; } #footerCopyrightContainer p { padding-left: 40px; } .footerbreak { visibility: visible; } } /* Desktop Layout: 769px to a max of 1232px. Inherits styles from: Mobile Layout and Tablet Layout. */ @media only screen and (min-width: 769px) { img.bg { min-height:100%; min-width:1024px; width:100%; height: auto; position:fixed; right:0px; z-index:-1; } .gridContainer { width: 88.5%; max-width: 1232px; padding-left: 0.75%; padding-right: 0.75%; margin: auto; } #body { min-height:100%; min-width: 1024px; width:100%; height: auto; background-repeat: no-repeat; right:0px; z-index:-1; } #header { clear: both; float: left; margin-left: 0; width: 100%; height: 120px; display: block; } #logo { clear: both; float: left; margin-left: 10px; width: 180px; display: block; position:absolute; z-index:+10; } #maintitle { clear: none; float: left; margin-left: 0%; width: 40%; display: block; margin-left:198px; text-align:left; margin-top:5px; } #emailcontainer { clear: none; float: right; margin-left: 1.6949%; width: 23.7288%; display: block; margin-top:25px; text-align:right; padding-right:10px; padding-top: 7px; } #socialicon { clear: none; float: right; margin-left: 1.6949%; width: 23.7288%; display: block; text-align:right; } #main_nav { clear: both; float: right; margin-left: 0; width: 100%; display: block; font-size:14px; } #main_nav ul{ margin-left:200px; } #homebtn{ width:110px; text-align:center; padding:2px 5px; vertical-align:text-bottom; } #acoba-uaebtn{ width:150px; text-align:center; padding:2px 5px; vertical-align:text-bottom; } #collegeprofilebtn{ width:180px; text-align:center; padding:2px 5px; vertical-align:text-bottom; } #eventsbtn{ width:120px; text-align:center; padding:2px 5px; vertical-align:text-bottom; } #newsbtn{ width:110px; text-align:center; padding:2px 5px; vertical-align:text-bottom; } #gallerybtn{ width:110px; text-align:center; padding:2px 5px; vertical-align:text-bottom; } #contactusbtn{ width:130px; text-align:center; padding:2px 5px; vertical-align:text-bottom; } #imgSlider{ clear: both; float: left; margin-left: 0; width: 100%; display: block; } #usefulLinks{ clear: both; float: left; margin-left: 0; width: 100%; display: block; } #mainbodyContainer{ clear: both; float: left; margin-left: 0; width: 74.5%; display: block; } #Column1{ clear: both; float: left; margin-left: 0; width: 45%; display: block; } #aboutcontainer{ clear: both; float: left; margin-left: 0; width: 100%; display: block; } #eventscontainer{ clear: both; float: left; margin-left: 0; width: 100%; display: block; } #eventsdatecontainer{ clear: both; float: left; margin-left: 0; width: 100%; display: block; } #eventsheading{ clear: both; float: left; margin-left: 0; width: 100%; display: block; } #eventscontent{ clear: both; float: left; margin-left: 0; width: 100%; display: block; } #sponsorContainer{ clear: both; float: left; margin-left: 0; width: 100%; display: block; } #Column2{ clear: none; float: left; margin-left: 2%; width: 50%; display: block; } #newsContainer{ clear: none; float: left; margin-left: 1.6949%; width: 105%; display: block; } .newssep{ clear: both; float: left; margin-left: 0; display: block; padding-bottom:0px; padding-top:10px; height: 168.5px; width: 100%; border-bottom-width: 1px; border-bottom-style: solid; border-bottom-color: rgb(221, 221, 221); } #imgthumnil{ clear: both; float: left; margin-left: 0; width: 40%; height: auto; display: block; } #newscontent{ clear: none; float: left; margin-left: 1.6949%; width: 55%; display: block; } #newsdate{ clear: both; float: left; margin-left: 0; width: 100%; display: block; } #newsheading{ clear: both; float: left; margin-left: 0; width: 100%; display: block; } #newsdetails{ clear: both; float: left; margin-left: 0; width: 100%; display: block; } #sidebarcontainer{ clear: none; float: right; margin-left: 1.6949%; width: 22.5%; display: block; } #sidebarsep01{ clear: both; float: left; margin-left: 0; width: 100%; display: block; } #sidebarsep02{ clear: both; float: left; margin-left: 0; width: 100%; display: block; } #EventsCalender{ clear: both; float: left; margin-left: 0; width: 100%; display: block; } #sidebtn{ clear: both; float: top; margin-left: 0; padding-top: 0; padding-bottom: 0; width: 100%; display: block; } #photogallery{ clear: both; float: left; margin-left: 0; width: 100%; display: block; } #videogallery{ clear: both; float: left; margin-left: 0; width: 100%; display: block; } #footerContainer{ clear: both; float: left; margin-left: 0; width: 100%; display: block; } #footernav{ clear: both; float: left; margin-left: 0; width: 78%; display: block; } #footerCopyrightContainer{ clear: both; float: left; margin-left: 0; width: 100%; display: block; } #footerCopyrightContainer p { padding-left: 40px; text-align:left; } }