

/* --- Addons ---- */
.row_head_cloud_white_grey {
background-image: url(/_styles/images/row_head_cloud_white_grey.svg);
height: 90px;
background-attachment: unset;
background-position: center;
background-repeat: repeat-x;
background-size: unset;
}
.imageBorderOnHover img{
border: solid 6px transparent;
transition: .5s ease !important;
}
.imageBorderOnHover img:hover {
 border: solid 6px white;
}

.imageBorderOnHover .img-responsive{
border: solid 6px transparent;
transition: .5s ease !important;
}
.imageBorderOnHover .img-responsive:hover {
 border: solid 6px white;
}
.imageShrink img {
    padding: 0 120px 0 120px;
}
.imageRotateCW img  {
transform: rotate(5deg);
}


.verticalCentredText2Col .content .colv-50{
  display: flex;
  justify-content: center;
  flex-direction: column;
}

.verticalCentredText2Col .content .colv-2{
  display: flex;
  justify-content: center;
  flex-direction: column;
}

.verticalCentredText2Col .title {
line-height: 1;
margin-top: 0;
margin-bottom: 0;
padding: 0;
min-height :20px;
}


.verticalCentredText2Col .title h2 {
margin-bottom: 0.5em;
line-height: 1em;
}
.imageRotateAC img  {
transform: rotate(-5deg);
}


.paperCurl2 {
background-image: url("/_styles/images/_backgroundImage/secshaddow.png");
background-position: top;
background-repeat: no-repeat;
background-size: 100% 100%; 
content: '';
height: 15px;
width: 90%;
max-width: ;
margin-right: auto;
margin-left: auto;
opacity: 0.8;
}
.paperCurl2 .pr-footer {
height: 15px;
}
.customer_grad_1bg {
background-image: linear-gradient(to bottom, , );
}
.customer_grad_2bg {
background-image: linear-gradient(to bottom, , );
}
.imageDarkenOnHover img {
    -webkit-filter: brightness(100%);
}

.imageDarkenOnHover img:hover {
    -webkit-filter: brightness(70%);
    -webkit-transition: all 1s ease;
    -moz-transition: all 1s ease;
    -o-transition: all 1s ease;
    -ms-transition: all 1s ease;
    transition: all 1s ease;
}
.row_head_cloud_grey_white {
background-image: url(/_styles/images/row_head_cloud_grey_white.svg);
height: 90px;
background-attachment: unset;
background-position: center;
background-repeat: repeat-x;
background-size: unset;
}
.hd2 {
/*border-bottom: none;*/
}
.row_footer_cloud_white_grey {
background-image: url(/_styles/images/row_footer_cloud_white_grey.svg);
height: 90px;
background-attachment: unset;
background-position: center;
background-repeat: repeat-x;
background-size: unset;
}
.row_footer_cloud_grey_white {
background-image: url(/_styles/images/row_footer_cloud_grey_white.svg);
height: 90px;
background-attachment: unset;
background-position: center;
background-repeat: repeat-x;
background-size: unset;
}
.row_footer_cloud_white_mid {
background-image: url(/_styles/images/row_footer_cloud_white_mid.svg);
height: 90px;
background-attachment: unset;
background-position: center;
background-repeat: repeat-x;
background-size: unset;
}
.row_head_cloud_white_mid {
background-image: url(/_styles/images/row_head_cloud_white_mid.svg);
height: 90px;
background-attachment: unset;
background-position: center;
background-repeat: repeat-x;
background-size: unset;
}
.imageHighlightOnHover img {
    -webkit-filter: brightness(100%);
}

.imageHighlightOnHover img:hover {
    -webkit-filter: brightness(130%);
    -webkit-transition: all 1s ease;
    -moz-transition: all 1s ease;
    -o-transition: all 1s ease;
    -ms-transition: all 1s ease;
    transition: all 1s ease;
}
.allWhiteText {
    color:white!important ;
}

.allWhiteText   .title h1  {
    color:white!important;
}

.allWhiteText   .title h2  {
    color:white!important;
}

.allWhiteText   .title h3  {
    color:white!important;
}

.allWhiteText  .title h4  {
    color:white!important;
}

.allWhiteText  .title h5  {
    color:white!important;
}

.allWhiteText  .title h6  {
    color:white!important;
}

.allWhiteText  .title a  {
    color:white!important;
}

.allWhiteText   a  {
    color:white!important;
}

.allWhiteText .docTableWithIcons {
    border-color: white!important;
}

.allWhiteText .docList  {
    color: white!important;
}

.allWhiteText  .docListItem  {
    color: white!important;
}

.allWhiteText .docList a {
    border-color: white!important;
    color: white;
}

.allWhiteText .docList .fileInfo {
    color: #ffffff!important; 
    opacity: 0.8;
} 

.allWhiteText .linksList .notes {
    color: #ffffff!important; 
    opacity: 0.8;
}

.allWhiteText .notes {
    color: #ffffff!important; 
    opacity: 0.8;
} 
.boxShadowRow  {
-webkit-box-shadow: 3px 5px 10px -1px rgba(0,0,0,0.45); 
box-shadow: 3px 5px 10px -1px rgba(0,0,0,0.35);
    padding-top: 30px;
    padding-right: 30px;
    padding-bottom: 30px;
    padding-left: 30px;
}
.boxShadowRowInset {
-webkit-box-shadow: inset 3px 5px 10px -1px rgba(0,0,0,0.45); 
box-shadow: inset 3px 5px 10px -1px rgba(0,0,0,0.45);
    padding-top: 30px;
    padding-right: 30px;
    padding-bottom: 30px;
    padding-left: 30px;
}
.secPadding {
	padding-top: 20px;
    padding-right: 30px;
    padding-bottom: 30px;
    padding-left: 30px; 
    margin-right: 5px;
    margin-left: 5px;
}
.padding80 {
padding-top:80px!important;
padding-bottom:80px!important;
}
.imageScaleOnHover img{
transition: all .6s ease;
}
.imageScaleOnHover img:hover {
transform: scale(1.1);
}

.imageScaleOnHover .img-responsive{
transition: all .6s ease;
}
.imageScaleOnHover .img-responsive:hover {
transform: scale(1.1);
}
.secContentTWhiteBG  {
    background-color:rgba(255, 255, 255, 0.68);
padding-top: 20px;
    padding-right: 30px;
    padding-bottom: 30px;
    padding-left: 30px;
border-radius:10px;
}
.secContentTBlackBG {
    background-color:rgba(0, 0, 0, 0.38);
	padding-top: 20px;
    padding-right: 30px;
    padding-bottom: 30px;
    padding-left: 30px;
	border-radius:10px;
	color:white;
}

.secContentTBlackBG   .title  {
	color:white;
}

.secContentTBlackBG .docTableWithIcons {
border-color: white;
}

.secContentTBlackBG .docList  {
color: white;
}
.secContentTBlackBG .docList a {
border-color: white;
color: white;
}

.secContentTBlackBG .docList .fileInfo {
color: #fbfbfba6;
} 

.secContentTBlackBG  .notes {
color:#fffdfdbf;
} 

.fixedBackground {
 background-attachment: fixed;
}
.hideDiv {
display: none;
}
.padding0 {
    padding-top: 0;
    padding-bottom: 0;
}
.padding10 {
padding:10px;

}
.padding20 {
padding:20px;
}
.blurFilter  {
-webkit-backdrop-filter: blur(4px);
backdrop-filter: blur(4px);
}
.roundBorderLarge {
	padding-top: 50px;
padding-right: 50px;
padding-bottom: 65px;
padding-left: 50px;
	border-radius:50px;
}
.roundBorderSmall {
padding-top: 20px;
padding-right: 20px;
padding-bottom: 20px;
padding-left: 20px;
border-radius:10px;
}
.rotateAnticlockwise {
-webkit-transform: rotate(-3deg);
transform: rotate(-3deg);
}
.rotateClockwise {
-webkit-transform: rotate(3deg);
transform: rotate(3deg);
}
.paperCurl {
	position:relative;
	background-color:white;
	padding:20px;
}

.paperCurl:before, .paperCurl:after {            
    bottom:22px;
	content: "";
	position: absolute;
	z-index: -1;
	-ms-transform: rotate(-5deg);
	-webkit-transform: rotate(-5deg);
	-o-transform: rotate(-5deg);
	-moz-transform: rotate(-5deg);
	box-shadow: 0 15px 5px rgba(0, 0, 0, 0.2);
	height: 50px;
	max-width: 50%;
	width: 50%;
	left:3px;
}

.paperCurl:after {
	-ms-transform: rotate(5deg);
	-webkit-transform: rotate(5deg);
	-o-transform: rotate(5deg);
	-moz-transform: rotate(5deg);
	left: auto;
	right: 2px;
}
.insetShaddow1 {
-moz-box-shadow:   inset 0  3px 10px #00000082;
-webkit-box-shadow:  inset 0  3px 10px #00000082;
box-shadow: inset 0  3px 10px #00000082;
}
.shadow_small {
box-shadow: 3px 3px 5px #00000052;
}
.customer_col_1bg {
	background-color: ;	
}
.customer_col_2bg {
background-color: red;
}
.customer_col_3bg {
background-color: red;
}
.customer_col_4bg {
background-color: red;
}
.customer_col_5bg {
background-color: red;
}
.customer_col_6bg {
background-color: red;
}
.customer_col_7bg {
background-color: red;
}
.customer_col_8bg {
background-color: red;
}
.foliageTexture3_bg {
background-image: url(/_styles/images/_backgroundImage/foliageAutumSeamlessTexture3.jpg);
background-position: center;
}
.noticeboardBG2 {
background-image: url(/_styles/images/noticeboard-bg2.jpg);
min-height: 400px;
background-attachment: fixed;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}
.googlemapBG {
background-image: url(/_styles/images/googlemap-bg2.jpg);
min-height: 400px;
background-attachment: fixed;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}
.paperTexture1_bg  {
background-image: url(/_styles/images/_backgroundTexture/paperSeamlessTexture1.png);
background-position: center;
}
.paperTexture2bg {
background-image: url(/_styles/images/_backgroundTexture/ep_naturalwhite.png);
background-position: center;
backdrop-filter: opacity(0.7);
}
.musicPaperTexture1_bg {
background-image: url(/_styles/images/_backgroundImage/musicPaperSeamlessTexture1.jpg);
background-position: center;
}
.graphyPaper{
background-image: url(/_styles/images/_backgroundPattern/graphy_@2X.png);
background-position: center;
backdrop-filter: opacity(0.7);
}
.snowTexture1_bg  {
background-image: url(/_styles/images/_backgroundTexture/snowSeamlessTexture1.png);
background-position: center;
}
.skyTexture1_bg {
background-image: url(/_styles/images/_backgroundImage/skySeamlessTexture1.jpg);
background-position: center;
}
.foliageTexture1_bg {
background-image: url(/_styles/images/_backgroundImage/foliageSeamlessTexture1.jpg);
background-position: center;
}
.foliageTexture2_bg {
background-image: url(/_styles/images/_backgroundImage/foliageAutumSeamlessTexture2.jpg);
background-position: center;
}
.corkBoardTexture1 {
background-image: url(/_styles/images/_backgroundTexture/corkboard1.png);
background-position: center;
}
.whiteBrickwall {
background-image: url(/_styles/images/_backgroundPattern/brickwall_@2X.png);
background-position: center;
backdrop-filter: opacity(0.7);
}
.bluesnowPattern {
background-image: url(/_styles/images/_backgroundPattern/bluesnowpattern.png);
background-position: center;
backdrop-filter: opacity(0.7);
}
.emailPattern {
background-image: url(/_styles/images/_backgroundPattern/emailPattern.png);
background-position: center;
backdrop-filter: opacity(0.7);
}
.sportsPattern {
background-image: url(/_styles/images/_backgroundPattern/sportsPattern.png);
background-position: center;
backdrop-filter: opacity(0.7);
}
.woodboardPlusItems_bg {
background-image: url(/_styles/images/_backgroundImage/woodboardPlusItems.jpg);
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}
.hWoodboardPlusItems_bg {
background-image: url(/_styles/images/_backgroundImage/horWoodPlusItems.jpg);
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}
.blackboard_bg {
background-image: url(/_styles/images/_backgroundImage/blackboard.jpg);
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}
.redbg{
background: red;
}
.green_bg  {
background-color: green;
}
.red_bg {
background-color: red;
}


/* --- Site Styles ---- */
/* Graeme High School */

.scrollingTxt2 {
  width: 100%;
  height: 40px;
  margin: 0;
  padding: 0;
  overflow: hidden;
  position: relative;
  background-color: #FFD400;
  /* border-radius: 5px; */
  /* box-shadow: 2px 2px 6px rgba(150, 150, 150, 0.4); */
  /* border-style: solid; */
  /* border-width: 1px; */
  /* border-color: white; */
  z-index: 400;
}

.scrollingTxt2 h2 {
	font-family: Arial, Helvetica, sans-serif;
}
.scrollingTxt2 span {
  position: absolute;
  width: 100%;
  height: 100%;
  margin: 0;
  font-size: 1.3em;
  color: white;
  white-space: nowrap;
  background-color: none;
  line-height: 39px;
  text-align: left;
  /* Starting position */
 -moz-transform:translateX(100%);
 -webkit-transform:translateX(100%);	
 transform:translateX(100%);
 /* Apply animation to this element */	
 -moz-animation: scrollingTxt2 30s linear infinite;
 -webkit-animation: scrollingTxt2 30s linear infinite;
 animation: scrollingTxt2 30s linear infinite;
}
/* Move it (define the animation) */
@-moz-keyframes scrollingTxt2 {
 0%   { -moz-transform: translateX(100%); }
 100% { -moz-transform: translateX(-100%); }
}
@-webkit-keyframes scrollingTxt2 {
 0%   { -webkit-transform: translateX(100%); }
 100% { -webkit-transform: translateX(-100%); }
}
@keyframes scrollingTxt2 {
 0%   { 
 -moz-transform: translateX(100%); /* Firefox bug fix */
 -webkit-transform: translateX(100%); /* Firefox bug fix */
 transform: translateX(100%); 		
 }
 100% { 
 -moz-transform: translateX(-100%); /* Firefox bug fix */
 -webkit-transform: translateX(-100%); /* Firefox bug fix */
 transform: translateX(-100%); 
 }
}
.scrollingTxt2 :hover {
 -moz-animation-play-state: paused;
 -webkit-animation-play-state: paused;
 animation-play-state: paused;
 }

.warning {
  background: repeating-linear-gradient(-60deg, #B40000, #B40000 10px, #C80F0F 10px, #C80F0F 20px);
}

.warning span {
  color: yellow;
  font-weight: 800;
  text-transform: uppercase;
}

@media all and (max-width: 768px) {
.scrollingTxt2 span {
 -moz-animation: scrollingTxt2 10s linear infinite;
 -webkit-animation: scrollingTxt2 10s linear infinite;
 animation: scrollingTxt2 10s linear infinite;
}

}

header {
    width: 100%;
    height: 150px;
    background-image: url(/_styles/images/header_background150.jpg);
    background-size: 1920px 150px;
    -o-background-size: 1920px 150px;
    -webkit-background-size: 1920px 150px;
    visibility: visible;
}
#header-group{
    width: 100%;
    height: 150px;
    max-width: 1270px;
    margin-right: auto;
    margin-left: auto;
    position: relative;
}
#header-schoolName{
    font-size:38pt;
    top: 45px;
    left: 160px;
    font-weight: bold;
    color: #ffffff;
    text-shadow:
        #9CC4F0 2px 0.991867px 2px,
        #415FA7 1px 0.991867px 2px,
        #9CC4F0 2px 0.991867px 2px,
        #415FA7 1px 0.991867px 2px,
        rgba(33, 36, 39, 0.109804) 4px 0px 3px,
        rgba(33, 36, 39, 0.0980392) 2.99349px 0.991867px 3px,
        rgba(33, 36, 39, 0.0941176) 1.98699px 1.98373px 3px,
        rgba(33, 36, 39, 0.0823529) 0.980482px 2.9756px 3px,
        rgba(33, 36, 39, 0.0784314) -0.0260245px 3.96747px 3px,
        rgba(33, 36, 39, 0.0745098) -1.03253px 4.95934px 3px,
        rgba(33, 36, 39, 0.0666667) -2.03904px 5.9512px 3px,
        rgba(33, 36, 39, 0.0627451) -3.04554px 6.94307px 3px,
        rgba(33, 36, 39, 0.0588235) -4.05205px 7.93494px 3px,
        rgba(33, 36, 39, 0.054902) -5.05856px 8.92681px 3px,
        rgba(33, 36, 39, 0.0470588) -6.06506px 9.91867px 3px,
        rgba(33, 36, 39, 0.0431373) -7.07157px 10.9105px 3px,
        rgba(33, 36, 39, 0.0392157) -8.07807px 11.9024px 3px,
        rgba(33, 36, 39, 0.0313726) -9.08458px 12.8943px 3px,
        rgba(33, 36, 39, 0.027451) -10.0911px 13.8861px 3px,
        rgba(33, 36, 39, 0.0235294) -11.0976px 14.878px 3px;
    color: #ffffff;
}
#header-schoolMotto {
    font: italic 18pt Georgia, "Times New Roman", Times, serif;
    top: 95px;
    left: 160px;
    color: #ffffff;
}
#header-logo {
    background: url(/_styles/images/header_logo.png) no-repeat;
    width: 160px;
    height: 160px;
    top: 10px;
    left: 0px;
    background-size: 160px 160px;
    -o-background-size: 160px 160px;
    -webkit-background-size: 160px 160px;
    visibility: visible;
}
    #subHeadImage {
    }

.sm-simple a, .sm-simple a:hover, .sm-simple a:focus, .sm-simple a:active {
    font-size: 14px;
    font-weight: normal;
    line-height: 15px;
}
/* Scrolling Speed */	
.scrollingTxt h3 { 
    -moz-animation: scrollingTxt 20s linear infinite;
    -webkit-animation: scrollingTxt 20s linear infinite;
    animation: scrollingTxt 20s linear infinite;
}
/*Scrolling text background over ride*/
.scrollingTxt {
    background: none;
    border-radius: 0;
    box-shadow: none;
    border-style: none;
    border-width: 1px;
    border-color:white;
}
@media all and (max-width: 768px) {				
    #header-schoolName{
        font-size:20pt;
        top: 70px;
        left: 110px;
        line-height: 95%;
    }
    #header-schoolMotto {
        font-size:15pt;
        top: 45px;
        left: 110px;
    }
    #header-logo {
        width: 95px;
        height: 95px;
        top: 30px;
        left: 10px;
        background-size: 95px 95px;
        -o-background-size: 95px 95px;
        -webkit-background-size: 95px 95px;
    }
    #subHeadImage {
        height: 0px;
        visibility: collapse;
    }								
}
/*Colour Over Rides NEW*/
body {  
    background-color: #ffffff;
    background: -webkit-linear-gradient(#9CC4F0, #ffffff, #ffffff)no-repeat;
    background: -o-linear-gradient(#9CC4F0,#ffffff, #ffffff)no-repeat;
    background: -moz-linear-gradient(#9CC4F0,#ffffff, #ffffff)no-repeat;
    background: linear-gradient(#9CC4F0, #ffffff, #ffffff)no-repeat;
}
#main-nav{
    background-color: #022579;
}
#navBarH {
    background-color: #022579;
}
footer {
    background-color: #ffffff;
}
#customeraddress {
    background-color: #022579;
}
.dropdown-menu >  li > a:hover,
.dropdown-menu >  li > a:focus {
    background: #0018E3; 
}
.sm-simple {
    background-color: #022579;
}
.sm-simple a.current {
    background-color: #022579;
}
.sm-simple ul {
    background-color: #022579;
}
.sm-simple a:hover, .sm-simple a:focus, .sm-simple a:active, .sm-simple a.highlighted, .dropdown-menu .sm-nowrap {
    background-color: #0018E3;
}
.sm-simple ul > li {
    border-top: 1px solid white;
}
.sm-simple ul > li:first-child {
    border-top: 1px solid white;
}
.pagination > li > a,
.pagination > li > span {
    background: #022579;
    color: #ffffff;
}
.pagination > li > a:hover,
.pagination > li > span:hover,
.pagination > li > a:focus,
.pagination > li > span:focus {
    background-color: #0018E3;
    color: #ffffff;
}
.pagination > .active > a,
.pagination > .active > span,
.pagination > .active > a:hover,
.pagination > .active > span:hover,
.pagination > .active > a:focus,
.pagination > .active > span:focus {
    color: #022579;
    background-color: #ffffff;
}