/* 
    Document   : arts-website
    Created on : 8-Apr-2013, 9:36:50 AM
    Author     : Amir Entezaralmahdi
    Description:
        Purpose of the stylesheet follows.
*/

root { 
    display: block;
}

#artslogo {
    width: 25px;
    height: 25px;
    background: 50% 50% no-repeat;
    text-decoration: none;
    float: left;
    font-size: 14px;
    line-height: 20px;
    margin-left: -15px;
    padding: 10px;
    display: block;
}
a#artslogo:hover{background-color: #522E91;}

#applybtn {     
    float: right;
}
#applybtn {
  text-decoration:none;
  font-weight:bold;
  font-size:14px;
  padding:8px;
  padding-left:18px;
  padding-right:18px;
  display:block;
    text-align:center;
     color:white;
     margin:5px;
     margin-top:8px;
    line-height:12px;     
    -moz-border-radius: 3px!important;
    -webkit-border-radius: 3px!important;
    -khtml-border-radius: 3px!important;
    border-radius: 3px!important;
   }
a#applybtn:hover {
    background: none;
}
#ubc7-unit-menu .nav{
    width:100%;
}
/*CAROUSEL*/
.transparent .carousel-caption{opacity:.92}
.transparent .carousel-caption a:hover{color:white;}
.transparent .carousel-caption h4{font-size:30px;line-height:30px;}
.transparent .carousel-caption{height:170px;left:20px;text-align:left;bottom:-40px;top:auto;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    -khtml-border-radius: 3px;
    border-radius: 3px;
 }
.flexslider{margin-left:-15px;margin-right:-15px;}
.flex-direction-nav, .flex-pauseplay, .flex-counter{bottom:-75px;}
.flex-direction-nav .flex-prev{background-position:-1040px -221px}
.flex-direction-nav .flex-next{background-position:-1108px -221px}
.flex-pauseplay .flex-pause{background-position:-1074px -221px}
.flex-pauseplay .flex-play{background-position:-1142px -221px}
.flex-direction-nav a, .flex-pauseplay a{background-color:#002145;}
.flex-direction-nav{right:15px;}
.flex-pauseplay{right:45px;}
.flex-direction-nav a,
.flex-pauseplay a{
	margin-top: 25px;
}

#shadow{position:absolute;height:45px;margin-left:20px;margin-top:40px;width:380px;padding:15px 0 10px;background:url("../img/HomepageBoxShadow.jpg") no-repeat scroll 0 0 transparent;}
#why-unit{position:absolute;width:50%;height:45px;margin-top:-11px;margin-left:50%;padding:15px 0 10px;background:url("../img/WhyUnitButton1.png");}
#why-unit span{color:white;text-align:center;display:inline-block;margin-left:25%}
div.why{clear:both;margin-bottom:20px;}

div.why h4{font-size:24px;margin-bottom:0px;}

@media (max-width: 767px) {
  div.newsitem .span3{width:23%;float:left;}
  div.newsitem .span9{width:73%;margin-left:3%;float:left;}
}
@media (max-width: 480px) {
  div.newsitem .span3{width:23%;float:left;}
  div.newsitem .span9{width:73%;margin-left:3%;float:left;}
}
@media(max-width:980px){
    #applybtn{float:none;} 
    #artslogo{background-image:url("../img/FOA_FullLogo.png");background-position:18px 50%}
    #artslogo:hover{background:url("../img/FOA_FullLogo.png") 18px 50% #543090 no-repeat;}
    #artslogo{width:100%;float:none;}
}
@media(max-width:861px){
   #shadow,#why-unit{display:none;}
  .transparent div.carousel-caption{left:0px;padding-bottom:20px;margin-bottom:20px;bottom:0px;border:none;border-radius:0px!important;}
  .flex-direction-nav, .flex-pauseplay, .flex-counter{bottom:52px;right:40px;}
  .transparent .flex-direction-nav{right:10px}
   .transparent div.carousel-caption h4{font-size:20px;line-height:22px;/*width:85%;*/}
  .flexslider{margin-bottom:0px;}
}