/* TEMPLATE Styles */

body
{
  margin: 0;
  padding: 0;
  font-family: 'Open Sans', Arial, Helvetica, sans-serif;
  font-size: 1rem;
  background: #f0f0f0;
  /*background:url('../images/Abstract_Digital_017.jpg');
  background-size:cover;
  background-position:center center;
  background-attachment:fixed;*/
  -webkit-transition: all .5s; /* Safari */
  transition: all .5s;     
}

#HeaderContainer
{
  /*background: #f0f0f0;*/
  width: 100%;
  /*position: fixed;*/
  /*z-index: 1;*/
  /*top: 0;*/
  max-height: 150px;
}

.HeaderContent
{
  max-width: 980px;
  margin: 0 auto;
  box-shadow: 0px 0px 30px rgba(0,0,0,0.25);
}

#HeaderContainer img
{
  max-width: 980px;
  width: 100%;
}

#MainContainer
{
  background: #ffffff;
  padding: 2rem 0 5rem;
  max-width: 980px;
  margin: 0 auto;
  -webkit-transition: all .5s; /* Safari */
  transition: all .5s;
  box-shadow: 0px 0px 30px rgba(0,0,0,0.15);
}

.sectionContent
{
  max-width: 980px;
  margin: 0 auto;
  padding: 0 2rem;
  -webkit-transition: all .5s; /* Safari */
  transition: all .5s;     
}

.sectionContent h1
{
  font-size: 1.9rem;
  font-weight: 300;
  text-transform: uppercase;
  margin: 0;
  padding: 0;
}

.sectionContent h2
{
  font-size: 1.5rem;
  font-weight: 300;
  text-transform: uppercase;
  margin: 0;
  padding: 0;
}

.sectionContent input
{
  border: none;
  padding: 5px !important;
  /* width: 100%; */
}

#AbstractContainer, #PortalContainer, #FooterContainer
{
  position: relative;
  /*top: 10rem;*/
  /*margin: 2rem 0;*/
}

#PortalContainer .sectionContent
{
  margin:0 0 2rem 0;
}

#FooterContainer
{
  background: #333;
  color: #fff;
  font-size: .8rem;
  max-width:980px;
  width: 100%;
  margin: 0 auto;
  /*margin: 5rem 0 0;*/
  padding: 1.5rem 0;
  box-shadow: 0px 10px 25px rgba(0,0,0,0.15);
}

#FooterContainer .sectionContent #copyright
{
  text-align: center;
  margin: 0 0 1rem;
}
#FooterContainer .sectionContent #copyright a
{
  color:#fff;
  text-decoration: none;
}

#FooterContainer .sectionContent #footerLinks
{
  text-align: center;
}

#FooterContainer .sectionContent #footerLinks a
{
  color:#fff;
  text-decoration: none;
  margin: 1rem;
  background: transparent;
  -webkit-transition: all .5s; /* Safari */
  transition: all .5s;   
}

#FooterContainer .sectionContent #footerLinks a:hover
{
  color:#f0f0f0;
}

/*input, select, textarea
{
  -webkit-appearance: none;
  border-radius: 0;
  background-color: #FFFFFF;
  font-family: inherit;
  border-style: solid;
  border-width: 1px;
  border-color: #cccccc;
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
  color: rgba(0, 0, 0, 0.75);
  display: block;
  font-size: 0.875rem;
  margin: 0 0 1rem 0;
  padding: 0.5rem;
  height: 2.3125rem;
  width: 100%;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  transition: all 0.15s linear;
}
*/

.xVideoPortal .xHeader .xTrackFilter select
{
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
}
.xVideoPortal .xHeader .xTrackFilter select::-ms-expand
{
  display: none;
}

.xList .xRow .xInformation .xLoadMore
{
  transform: translate(calc(0% - 50px),50px);
}

.xList .xRow:hover .xInformation .xLoadMore
{
  transform: translate(calc(0% - 50px),0px);
}



@media screen and (min-width:641px) and (max-width:768px)
{
  
}

@media screen and (min-width:481px) and (max-width:640px)
{
  body
  {
    background: #fff;
  }
  #MainContainer
  {
    padding-left: 1rem;
    padding-right: 1rem;
  }
  .sectionContent
  {
    padding: 0;
  }
  #FooterContainer .sectionContent #footerLinks a
  {
    background: #f0f0f0;
    color: #333;
    display: block;
    width: 50%;
    padding: .5rem;
    text-transform: uppercase;
    margin: 1rem auto;
  }
}

@media screen and (min-width:320px) and (max-width:480px)
{
  body
  {
    background: #fff;
  }  
  #MainContainer
  {
    padding-left: 1rem;
    padding-right: 1rem;
  }
  .sectionContent
  {
    padding: 0;
  }  
  #FooterContainer .sectionContent #footerLinks a
  {
    background: #f0f0f0;
    color: #333;
    display: block;
    width: 50%;
    padding: .5rem;
    text-transform: uppercase;
    margin: 1rem auto;
  }
}