/*
 Custom style for documents.
 
 Not needed for Mega Menu or Bootstrap.
 
 Developed by Weborithm.
 Follow me on twitter.com/weborithm
 
*/
html { 
    background-color:#0b1c30;
 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.pagecontentclients {

text-align:center;
}

    .contactformcontainer {
        width:50%;
       position:relative;
       float:right;
       
    }
        .contactdetails {
        
       
        width:30%;
    }

.lead { color: #5a5a5a }
.span4 h2 { font-family: 'Lato', sans-serif; font-weight: 300; }
.page-header h1 { font-family: 'Lato', sans-serif; font-weight: 300; }
.lead { font-family: 'Lato', sans-serif; font-weight: 400; }
p { font-family: 'Karla', sans-serif; }

body
{
font: 15px "Trebuchet MS", sans-serif;
margin: 50px;
color:#666;
}

.header2 {
    font: 24px "Trebuchet MS", sans-serif;
    font-weight:bold;
color:#333;
}



.outerpagecontainer {
    width:100%;
    margin-left:auto;
margin-right:auto
}

.divider {
height:1px;
width: 90%;
background-color:grey;
margin-left:auto;
margin-right:auto;
}
.container
{
position:relative;
width:100%;
}

.right
{
position:absolute;
right:0px;
width:300px;

}
.animstill {
    display:block;
    background-image:url(/images/animstill.jpg);
}
.pageheader {

    width:75%;
    margin-left:auto;
    margin-right:auto;
}
.pagecontainer {
    background-color:white;
    padding: 10px 10px 10px 10px;
    width:73%;
    margin-left:auto;
    margin-right:auto;
      -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  border-radius: 6px;

  border: 4px solid #CDCDCD;
}


.accreditationimage {
        width: 100%;
    margin-left:auto;
    margin-right:auto;
    text-align:center;
}
.divider {
    background-color:#999;
    height:1px;
    width: 90%;
    margin-left:auto;
    margin-right:auto;
}
.signature {
        width:50%;
    margin-left:auto;
margin-right:auto;
background-color:#FFF;
padding: 10px 10px 10px 10px;
text-align:center;
}

.thumbnails {
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    text-align:center;
}
.brandholder {
    display:none;
}
img,
embed,
object,
video {
  max-width: 100%;
}
.pagecontent {
    padding: 20px 20px 40px 20px;
    text-align:justify;

}

.bannerimage {
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    text-align:center;
}

.bannerimageanim {
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    text-align:center;
    display:inline;
}

.bannerimageanimation{
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    text-align:center;
    z-index:0;
    max-width:100%;
}

/* Smartphones (portrait and landscape) ----------- */
@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 480px) {
/* Styles */
.outerpagecontainer {
    width:100%;
    margin-left:auto;
margin-right:auto;
}
.pageheader {

    width:100%;
    margin-left:auto;
    margin-right:auto;
}
.pagecontainer {
    background-color:white;
    padding: 10px 10px 10px 10px;
    width:95%;
    margin-left:auto;
    margin-right:auto;
}
.header2 {
    font: 18px "Trebuchet MS", sans-serif;
    font-weight:bold;
color:#333;
}
    .contactformcontainer {
        display:none;
    }
        .bannerimageanimation {
        display: none;
    }
    .brandholder {
        display: block;
    }
}

/* Smartphones (landscape) ----------- */
@media only screen 
and (min-width : 321px) {
/* Styles */
.outerpagecontainer {
    width:100%;
    margin-left:auto;
margin-right:auto
}
    body {
        margin: 0px;
    }


}

/* Smartphones (portrait) ----------- */
@media only screen 
and (max-width : 320px) {
/* Styles */
.outerpagecontainer {
    width:100%;
    margin-left:auto;
margin-right:auto;
}
    body {
        margin: 2%;
    }

}

/* iPads (portrait and landscape) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) {
/* Styles */
.outerpagecontainer {
    width:100%;
    margin-left:auto;
margin-right:auto;
}
.pageheader {

    width:93%;
    margin-left:auto;
    margin-right:auto;
}
.pagecontainer {
    background-color:white;
    padding: 10px 10px 10px 10px;
    width:90%;
    margin-left:auto;
    margin-right:auto;
}
    .bannerimageanimation {
        display: none;
    }
        .brandholder {
        display: block;
    }
}

/* iPads (landscape) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : landscape) {
/* Styles */
.outerpagecontainer {
    width:100%;
    margin-left:auto;
margin-right:auto;
}
    .brandholder {
        display: none;
    }

        .bannerimageanimation {
        display: none;
    }

}

/* iPads (portrait) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : portrait) {
/* Styles */
.outerpagecontainer {
    width:100%;
    margin-left:auto;
margin-right:auto;
}
    .bannerimageanimation {
        display: none;
    }
}

/* Desktops and laptops ----------- */
@media only screen 
and (min-width : 1224px)
and (max-width : 1823px) 

 {
/* Styles */
    .brandholder {
        display: none;
    }
        .animstill {
  display:none;
}


}

/* Large screens ----------- */
@media only screen 
and (min-width : 1824px) {
/* Styles */
    .brandholder {
        display: none;
    }
        .animstill {
  display:none;
}

}

/* iPhone 4 ----------- */
@media
only screen and (-webkit-min-device-pixel-ratio : 1.5),
only screen and (min-device-pixel-ratio : 1.5) {
/* Styles */
.outerpagecontainer {
    width:100%;
    margin-left:auto;
margin-right:auto;
}
    body {
        margin: 2%;
    }

}

/* between screen sizes (monitors) ----------- */
@media only screen and (min-width : 1025px) and (max-width : 1223px) {
    /* Styles */
    .animstill {
        display: none;
    }
}