/*--
Author: CyberSpace Production
Author URL: https://cyberspaceproduction.com
 
 
--*/

.loading {
    border-radius: 50%;
    border: 16px solid #f3f3f3; /* Light grey */
    border-top: 16px solid #3498db; /* Blue */
    width: 120px;
    height: 120px;
    -webkit-animation: spin 2s linear infinite;
    animation: spin 2s linear infinite;
    margin: 0 auto;
    margin-top:15% 
  }
  
  @-webkit-keyframes spin {
    0% { -webkit-transform: rotate(0deg); }
    100% { -webkit-transform: rotate(360deg); }
  }
  
  @keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
  }
.u { text-decoration: underline }

.table > thead { background: #43a0d9 }

body {
    background: aliceblue;
    font-family: 'Roboto', sans-serif;
    margin: 0;
}
.annoucement{
    text-align: center;
    margin:0 !important;
    font-size: 1.25em !important;
}

body a {
    -moz-transition: .5s all;
    -ms-transition: .5s all;
    -o-transition: .5s all;
    -webkit-transition: .5s all;
    outline: 0;
    text-decoration: none;
    transition: .5s all;
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'Yanone Kaffeesatz', sans-serif;
    margin: 0;
}

p { margin: 0 }

ul, label {
    margin: 0;
    padding: 0
}

body a:hover { text-decoration: none }

body a:focus {
    outline: 0;
    text-decoration: none
}

.headerBar {
    background: #43a0d9;
    border-bottom: 3px solid #fff;
    padding: 1.5em 0 1.1em;
}

.navbar-default {
    background: 0;
    border: 0;
    margin: 0;
    min-height: inherit
}

.navbar-header h1 {
    font-family: 'Yanone Kaffeesatz', sans-serif;
    font-size: 3.5em;
}

.navbar-header h1 a {
    color: #fff;
    display: block;
    text-decoration: none;
}

.navbar-header h1 a span {
    color: #fff;
    display: block;
    font-family: 'Yanone Kaffeesatz', sans-serif;
    font-size: .28em;
    letter-spacing: 3px;
    margin-top: .3em;
}

ul.nav.navbar-nav.navbar-left { margin-top: 1.3em }

.navbar-default .navbar-brand, .navbar-default .navbar-brand:hover, .navbar-default .navbar-brand:focus { color: #fff }

.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:hover, .navbar-default .navbar-nav > .active > a:focus {
    background: none !important;
    color: #ce5a57
}

.navbar-nav > li { margin-right: 2.5em }

.navbar-nav > li:nth-child(5) { margin: 0 }

.navbar-nav > li > a {
    font-size: 1.1em;
    line-height: 35px;
    padding: 0;
}

.navbar-default .navbar-nav > li > a { color: #fff }

.navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:hover, .navbar-default .navbar-nav > .open > a:focus {
    background: 0;
    color: #ce5a57
}

.navbar-default .navbar-nav > li > a:hover, .navbar-default .navbar-nav > li > a:focus { color: #fff }

.navbar-default .navbar-nav li.active1 a { color: #ce5a57 }

div#bs-example-navbar-collapse-1 {
    margin: 0;
    padding: 0;
}

.dropdown-menu {
    font-size: 13px;
    min-width: inherit;
    top: 126%;
}

.navbar-right .dropdown-menu {
    left: 0;
    right: auto
}

.dropdown-menu > li > a { padding: 5px 15px }

.navbar-header h1 a i {
    color: #00ea09;
    font-style: inherit
}

.navbar-header h1 a i.logo-cyber2 { color: #ffc107 }

.navbar-header h1 a i.logo-cyber3 { color: #ce5a57 }

.navbar-header h1 a i.logo-cyber4 { color: #02e2ff }

.link--motion { overflow: hidden }

.link--motion span {
    -moz-transform: perspective(1000px) rotate3d(0, 1, 0, 0deg);
    -moz-transition: transform .5s, color .5s;
    -ms-transform: perspective(1000px) rotate3d(0, 1, 0, 0deg);
    -ms-transition: transform .5s, color .5s;
    -o-transform: perspective(1000px) rotate3d(0, 1, 0, 0deg);
    -o-transition: transform .5s, color .5s;
    -webkit-transform: perspective(1000px) rotate3d(0, 1, 0, 0deg);
    -webkit-transition: -webkit-transform .5s, color .5s;
    display: inline-block;
    position: relative;
    transform: perspective(1000px) rotate3d(0, 1, 0, 0deg);
    transition: transform .5s, color .5s
}

.link--motion:hover span {
    -moz-transform: perspective(1000px) rotate3d(0, 1, 0, 360deg);
    -ms-transform: perspective(1000px) rotate3d(0, 1, 0, 360deg);
    -o-transform: perspective(1000px) rotate3d(0, 1, 0, 360deg);
    -webkit-transform: perspective(1000px) rotate3d(0, 1, 0, 360deg);
    color: #ffc107;
    transform: perspective(1000px) rotate3d(0, 1, 0, 360deg)
}

.link--motion span:nth-child(4), .link--motion:hover span:first-child {
    -moz-transition-delay: 0s;
    -ms-transition-delay: 0s;
    -o-transition-delay: 0s;
    -webkit-transition-delay: 0s;
    transition-delay: 0s
}

.link--motion span:nth-child(3), .link--motion:hover span:nth-child(2) {
    -moz-transition-delay: .1s;
    -ms-transition-delay: .1s;
    -o-transition-delay: .1s;
    -webkit-transition-delay: .1s;
    transition-delay: .1s
}

.link--motion span:nth-child(2), .link--motion:hover span:nth-child(3) {
    -moz-transition-delay: .2s;
    -ms-transition-delay: .2s;
    -o-transition-delay: .2s;
    -webkit-transition-delay: .2s;
    transition-delay: .2s
}

.link--motion span:first-child, .link--motion:hover span:nth-child(4) {
    -moz-transition-delay: .3s;
    -ms-transition-delay: .3s;
    -o-transition-delay: .3s;
    -webkit-transition-delay: .3s;
    transition-delay: .3s
}

.banner-img1, .banner-img2 {
    background: url("../images/flowera-compressed.jpg") no-repeat center;
    background-size: cover;
    min-height: 700px
}

.banner-img2 {
    background: url(../images/2.jpg) no-repeat center 0;
    background-size: cover
}

.banner-img3 {
    background: url(../images/cloth.jpg) no-repeat center -550px;
    background-size: cover;
    min-height: 400px;
}
.banner-img4 {
    background: linear-gradient(rgba(240, 248, 255, .1), rgba(0, 0, 0, 0.45)), url(../images/garden.jpg) no-repeat center -690px;
    background-size: cover;
    min-height: 300px;
}

.banner-img5 {
    background: linear-gradient(rgba(240, 248, 255, .1), rgba(0, 0, 0, 0.45)), url(../images/world.jpeg) no-repeat center -700px fixed;
    background-size: cover;
    min-height: 300px;
}

.banner-img6 {
    background: linear-gradient(rgba(240, 248, 255, .1), rgba(0, 0, 0, 0.45)), url(../images/long.JPG) no-repeat center -600px ;
    background-size: cover;
    min-height: 300px;
}
.banner-schooltext {
    margin: 0 auto;
    padding-top: 22%;
    text-align: right;
    width: 76%;
}

.banner-schooltext h3, .banner-schooltext h2 {
    color: #fff;
    font-family: 'Yanone Kaffeesatz', sans-serif;
    font-size: 6em;
    line-height: 1.3em;
    padding-left: 2em;
    text-transform: Uppercase;
}

a.montessoribtn {
    -moz-transition: all .5s;
    -o-transition: all .5s;
    -webkit-transition: all .5s;
    color: #fff;
    display: inline-block;
    font-size: 1em;
    margin-top: 1em;
    outline: 0;
    padding: .7em 2em;
    position: relative;
    transition: all .5s;
}

.montessoribtn::before {
    -moz-transition: all .3s;
    -o-transition: all .3s;
    -webkit-transition: all .3s;
    border: 1px solid rgba(255, 255, 255, 0.8);
    content: '';
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    transition: all .3s;
    width: 100%;
    z-index: 1;
}

.montessoribtn:hover::before {
    -moz-transform: scale(1.2, 1.2);
    -ms-transform: scale(1.2, 1.2);
    -o-transform: scale(1.2, 1.2);
    -webkit-transform: scale(1.2, 1.2);
    opacity: 0;
    transform: scale(1.2, 1.2)
}

.montessoribtn::after {
    -moz-transform: scale(0.5, 0.5);
    -moz-transition: all .3s;
    -ms-transform: scale(0.5, 0.5);
    -o-transform: scale(0.5, 0.5);
    -o-transition: all .3s;
    -webkit-transform: scale(0.5, 0.5);
    -webkit-transition: all .3s;
    background-color: rgba(255, 255, 255, 0.25);
    content: '';
    height: 100%;
    left: 0;
    opacity: 0;
    position: absolute;
    top: 0;
    transform: scale(0.5, 0.5);
    transition: all .3s;
    width: 100%;
    z-index: 1;
}

.montessoribtn:hover::after {
    -moz-transform: scale(1, 1);
    -ms-transform: scale(1, 1);
    -o-transform: scale(1, 1);
    -webkit-transform: scale(1, 1);
    opacity: 1;
    transform: scale(1, 1)
}

.about, .news, .services, .testimonial, .about, .team, .contact, .gallery, .codes { padding: 5em 0 }

.about h4 {
    color: #ce5a57;
    font-size: 1.8em;
    font-weight: 300;
    margin-bottom: .4em
}

.about-right ul li {
    color: #151515;
    display: block;
    font-size: 1em;
    margin-top: 1em
}

.about-right ul li span.glyphicon {
    color: #ce5a57;
    padding-right: 6px;
}

p {
    color: #151515;
    font-size: 1em;
    line-height: 1.8em
}

h3.cyber-title {
    color: #43a0d9;
    font-family: 'Yanone Kaffeesatz', sans-serif;
    font-size: 4em;
    line-height: 1.3em;
    padding: .8em 2em;
    text-align: center;
}

.news { background: #43a0d9 }

.news-schoolleft h4 {
    font-size: 2em;
    font-weight: 300
}

.news-schoolleft h4 a {
    -moz-transition: .5s all;
    -ms-transition: .5s all;
    -o-transition: .5s all;
    -webkit-transition: .5s all;
    color: #fff;
    transition: .5s all
}

.news-schoolleft h6 {
    color: #000;
    font-size: 1.3em;
    font-weight: 300;
    margin: 1em 0 .5em;
}

.news-schoolleft p {
    color: #fff;
    width: 80%
}

.news-schoolright img {
    border: 1px dashed #fff;
    width: 100%;
}

.news-schoolleft h4 a:hover { color: #000 }

h3.cyber-title1 {
    color: #000;
    font-family: 'Yanone Kaffeesatz', sans-serif;
    font-size: 4em;
    line-height: 1em;
    margin-bottom: 1em;
    text-align: center;
}

.news-schoolleft.news-cyberleft1 { float: right }

.news-cyberinfo.btm-newsrow { margin-top: 4em }

.services-cyberrow { margin-top: 4em }

.services-grid {
    padding: 0 2.5em;
    text-align: center;
}

.services span {
    -moz-border-radius: 50%;
    -moz-transition: .5s all;
    -webkit-border-radius: 50%;
    -webkit-transition: .5s all;
    background: #ffc107;
    border-radius: 50%;
    color: #fff;
    display: inline-block;
    font-size: 1.5em;
    padding: 1em;
    text-decoration: none;
    transition: .5s all;
    z-index: 1;
}

.services span.fa.fa-heart { background: #68c100 }

.services span.fa.fa-puzzle-piece { background: #ffc107 }

.services h5 {
    color: #ce5a57;
    font-size: 1.8em;
    font-weight: 400;
    margin: .8em 0 .4em;
}

.cyber_elite {
    color: #ce5a57;
    font-size: 1.8em;
    font-weight: 400;
    margin-top: -1em;
    padding-bottom: 3em;
    text-align: center;
}

@media (max-width: 999px) {
    .agileits-w3layoutsleft img { margin: 0 auto }
}
.banner-img5 {
    background: linear-gradient(rgba(240, 248, 255, .1), rgba(0, 0, 0, 0.45)), url(../images/world.jpeg) no-repeat center -500px fixed;
    background-size: cover;
    min-height: 300px;
}
.services-grid:hover span {
    -moz-transform: scale(1.2);
    -ms-transform: scale(1.2);
    -o-transform: scale(1.2);
    -webkit-transform: scale(1.2);
    background: #00BCD4 !important;
    transform: scale(1.2)
}

.cyberspace-slide {
    background: linear-gradient(rgba(240, 248, 255, .1), rgba(0, 0, 0, 0.45)), url(../images/Wateringflowers.png) no-repeat center fixed;
    background-size: cover;
    padding: 3em 0;
    text-align: center
}

.cyberspace-slide h4 {
    color: #fff;
    font-family: 'Yanone Kaffeesatz', sans-serif;
    font-size: 4em;
}

.cyberspace-slide p {
    color: #fff;
    margin: 1.5em auto 1em;
    width: 70%;
}

.cyberspace-test {
    -moz-border-radius: 5px;
    -moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
    -webkit-border-radius: 5px;
    -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
    background: #fff;
    border-radius: 5px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
    margin: 0 auto;
}

.cyberspace-test-top {
    background: url(../images/1.jpg) no-repeat center;
    background-size: cover;
    min-height: 150px;
}

.cyberspace-test-top.cyberspace-test-top1 {
    background: url(../images/2.jpg) no-repeat center;
    background-size: cover
}

.cyberspace-test-bottom { padding: 2em }

.cyberspace-test-bottom img {
    -moz-border-radius: 50%;
    -o-border-radius: 50%;
    -webkit-border-radius: 50%;
    border: 2px solid #fff;
    border-radius: 50%;
    box-shadow: 0 0 0 !important;
    margin: -5em auto 1.5em;
    width: inherit !important;
}

.flip-content { width: 275px }

.cyberspace-test h4 {
    color: #00bcd4;
    font-size: 2em;
    font-weight: 300
}

.cyberspace-test h6 {
    font-size: 1.2em;
    margin: .5em 0
}

.footer {
    background: #1d1d1d;
    border-top: 1px solid #43a0d9;
    padding: 3em 0;
}

.footer h3 {
    color: #fff;
    font-size: 2.5em;
    font-weight: 200;
    margin-bottom: .8em;
}

.footer-grid li {
    display: block;
    margin-top: 1em
}

.footer-grid li a {
    color: #fff;
    display: inline-block;
    font-size: 1em;
    font-weight: 300;
    outline: 0;
    text-decoration: none;
}

.footer-grid li a:hover { margin-left: .5em }

.footer-grid li a i.glyphicon { margin-right: .8em }

.footer-grid.footer-tags li { display: inline-block }

.footer-grid.footer-tags li a {
    background: #00bcd4;
    border: 1px dashed #00bcd4;
    margin-right: 12px;
    padding: .4em 1em;
}

.footer-grid.footer-tags li a:hover {
    background-color: transparent;
    color: #00bcd4;
    margin-left: 0;
}

.footer-grid.footer-tags { padding-left: 0 }

.footer-grid form { position: relative }

.footer-grid p {
    color: #fff;
    font-weight: 300;
    margin-bottom: 1em;
}

.footer-grid input[type="email"] {
    -moz-transition: .5s all;
    -webkit-appearance: none;
    -webkit-transition: .5s all;
    background: 0;
    border: 1px solid #fff;
    color: #fff;
    float: left;
    font-size: .9em;
    outline: 0;
    padding: .8em;
    transition: .5s all;
    width: 63%;
}

.footer-grid form:hover input[type="email"] { border-color: #ce5a57 }

.footer-grid input[type="submit"] {
    -moz-transition: .5s all;
    -webkit-appearance: none;
    -webkit-transition: .5s all;
    background: 0;
    border: 1px solid #FFF;
    color: #fff;
    float: left;
    font-size: .9em;
    margin-left: 1em;
    outline: 0;
    padding: .8em 1.5em;
    transition: .5s all;
}

.footer-grid form:hover input[type="submit"] {
    background-color: #ce5a57;
    border-color: #ce5a57
}

.footer-grid li a i.fa {
    margin-right: .6em;
    width: 20px
}

.footer-grid li a:hover { color: #00bcd4 }

.copy-right {
    background: #000;
    padding: 2em 0;
}

.copy-right p {
    color: #fff;
    text-align: center;
}

.copy-right p a {
    color: #ffc107;
    text-decoration: none
}

.copy-right p a:hover { color: #fff }

.list-group a:hover { background: #03a9f4 }

.about-cyberbanner .banner-img1 { min-height: 300px }

.about-cyberbanner .banner-schooltext { padding-top: 7% }

.about-cyberbanner .banner-schooltext h2 {
    font-size: 5em;
    font-weight: 100;
    text-transform: capitalize;
}

h3.cyberspacetitle {
    color: #ce5a57;
    font-size: 2.5em;
    text-transform: capitalize
}

.about p {
    font-weight: 300;
    margin-top: 1.5em;
}

.about-cyberspaceprogrids img { width: 100% }

.about-cyberspaceprogrids:nth-child(1) { padding-right: 0 }

.about-cyberspaceprogrids:nth-child(2) { padding: 0 1em 0 2em }

.cyber-pi { margin-top: 2.5em }

.pince-left {
    -moz-border-radius: 17px 0;
    -webkit-border-radius: 17px 0;
    border: 1px solid #00bcd4;
    border-radius: 17px 0;
    float: left;
    padding: .8em 1em;
    text-align: center;
    width: 17%;
}

.pince-right {
    float: right;
    width: 75%
}

.cyber-pi h4 {
    color: #000;
    font-size: 1.4em;
    margin-bottom: .4em
}

.cyber-pi h5 {
    -moz-transition: .5s all;
    -ms-transition: .5s all;
    -o-transition: .5s all;
    -webkit-transition: .5s all;
    color: #00bcd4;
    font-size: 1.8em;
    transition: .5s all;
}

.about .pince-right p { margin: 0 }

.cyber-pi:hover .pince-left { background-color: #00bcd4 }

.cyber-pi:hover h5 {
    -moz-transform: rotatey(360deg);
    -ms-transform: rotatey(360deg);
    -o-transform: rotatey(360deg);
    -webkit-transform: rotatey(360deg);
    color: #fff;
    transform: rotatey(360deg);
}

.about-slid {
    background: linear-gradient(rgba(240, 248, 255, .1), rgba(0, 0, 0, 0.75)), url(../images/enviroment.jpg) no-repeat center fixed;
    background-size: cover;
    padding: 5em 0;
    text-align: center;
}

.about-slid.agileits-w3layouts h3.cyber-title1 { color: #00bcd4 }

.about-slid h5 {
    color: #fff;
    font-size: 2.5em;
    font-weight: 300;
    letter-spacing: 10px
}

.team-grids {
    overflow: hidden;
    position: relative;
}

.team-grids img { width: 100% }

.team h4 {
    color: #fff;
    font-size: 2em;
    font-weight: 300;
    letter-spacing: 1px
}

.team .img-cyberinfo-text p {
    color: #fff;
    margin: .5em 0 .8em
}

.img-cyberinfo-text {
    -moz-transition: .5s all;
    -webkit-transition: .5s all;
    padding: 1.5em 2em 0;
    position: absolute;
    text-align: center;
    top: -50%;
    transition: .5s all;
    width: 90%;
}

.img-caption::before {
    -moz-transition: .5s all;
    -webkit-transition: .5s all;
    background: rgba(255, 20, 147, 0.65);
    content: '';
    position: absolute;
    top: inherit;
    transition: .5s all;
    width: 0;
    z-index: 0;
}

.team-grids:hover div.img-cyberinfo-text { top: 52% }

.team-grids:hover div.img-caption::before {
    bottom: 0;
    height: 50%;
    width: 90%;
}

.cyberSocial-icons ul li {
    display: inline-block;
    margin: 0 .5em
}

.cyberSocial-icons ul li a { color: #fff }

.cyberSocial-icons ul li a:hover { color: #ffc107 }

.w3gallery-grids { padding: 1em }

[class^='imghvr-'], [class*=' imghvr-'] {
    -moz-osx-font-smoothing: grayscale;
    -moz-transform: translateZ(0);
    -ms-transform: translateZ(0);
    -o-transform: translateZ(0);
    -webkit-backface-visibility: hidden;
    -webkit-transform: translateZ(0);
    backface-visibility: hidden;
    background-color: #00bcd4;
    color: #212121;
    cursor: pointer;
    display: inline-block;
    margin: 0;
    max-width: 100%;
    overflow: hidden;
    position: relative;
    transform: translateZ(0);
}

[class^='imghvr-'] > img, [class*=' imghvr-'] > img {
    max-width: 100%;
    vertical-align: top;
}

[class^='imghvr-'] .cyber-figurecaption, [class*=' imghvr-'] .cyber-figurecaption {
    background-color: #00bcd4;
    bottom: 0;
    color: #212121;
    left: 0;
    padding: 4.5em;
    position: absolute;
    right: 0;
    text-align: center;
    top: 0;
}

[class^='imghvr-'] .cyber-figurecaption h4 {
    font-size: 2.5em;
    margin-bottom: .5em
}

[class^='imghvr-'] .cyber-figurecaption p {
    color: #fff;
    line-height: 2em;
}

[class^='imghvr-'] a, [class*=' imghvr-'] a {
    bottom: 0;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 1
}

[class^='imghvr-'], [class*=' imghvr-'], [class^='imghvr-']:before, [class^='imghvr-']:after, [class*=' imghvr-']:before, [class*=' imghvr-']:after, [class^='imghvr-'] *, [class*=' imghvr-'] *, [class^='imghvr-'] *:before, [class^='imghvr-'] *:after, [class*=' imghvr-'] *:before, [class*=' imghvr-'] *:after {
    -moz-box-sizing: border-box;
    -moz-transition: all .35s ease;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -webkit-transition: all .35s ease;
    box-sizing: border-box;
    transition: all .35s ease
}

[class^='imghvr-hinge-'], [class*=' imghvr-hinge-'] {
    -webkit-perspective: 50em;
    perspective: 50em
}

[class^='imghvr-hinge-'] .cyber-figurecaption, [class*=' imghvr-hinge-'] .cyber-figurecaption {
    opacity: 0;
    z-index: 1
}

[class^='imghvr-hinge-']:hover img, [class*=' imghvr-hinge-']:hover img { opacity: 0 }

[class^='imghvr-hinge-']:hover .cyber-figurecaption, [class*=' imghvr-hinge-']:hover .cyber-figurecaption {
    -moz-transition-delay: .21s;
    -ms-transition-delay: .21s;
    -o-transition-delay: .21s;
    -webkit-transition-delay: .21s;
    opacity: 1;
    transition-delay: .21s
}

.imghvr-hinge-right img {
    -moz-transform-origin: 100% 50%;
    -ms-transform-origin: 100% 50%;
    -o-transform-origin: 100% 50%;
    -webkit-transform-origin: 100% 50%;
    transform-origin: 100% 50%
}

.imghvr-hinge-right .cyber-figurecaption {
    -moz-transform-origin: 0 50%;
    -moz-transform-origin: 0 50%;
    -ms-transform-origin: 0 50%;
    -ms-transform-origin: 0 50%;
    -o-transform-origin: 0 50%;
    -o-transform-origin: 0 50%;
    -webkit-transform: rotateY(90deg);
    -webkit-transform-origin: 0 50%;
    transform: rotateY(90deg);
    transform-origin: 0 50%
}

.imghvr-hinge-right:hover > img {
    -moz-transform: rotateY(-90deg);
    -ms-transform: rotateY(-90deg);
    -o-transform: rotateY(-90deg);
    -webkit-transform: rotateY(-90deg);
    transform: rotateY(-90deg)
}

.imghvr-hinge-right:hover .cyber-figurecaption {
    -moz-transform: rotateY(0deg);
    -ms-transform: rotateY(0deg);
    -o-transform: rotateY(0deg);
    -webkit-transform: rotateY(0deg);
    transform: rotateY(0deg)
}

.contact-left iframe {
    border: 0;
    min-height: 32.5em;
    width: 100%;
}

.contact input[type="text"] {
    -moz-border-radius: 3px;
    -webkit-appearance: none;
    -webkit-border-radius: 3px;
    background: 0;
    border: solid 1px #151515;
    border-radius: 3px;
    color: #151515;
    font-size: 1em;
    margin-bottom: 1.5em;
    outline: 0;
    padding: .8em 1em;
    width: 100%;
}

.contact textarea {
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    -o-border-radius: 3px;
    -webkit-appearance: none;
    -webkit-border-radius: 3px;
    background: 0;
    border: solid 1px #151515;
    border-radius: 3px;
    color: #151515;
    font-size: .9em;
    min-height: 14.8em;
    outline: 0;
    padding: .6em 1em;
    resize: none;
    width: 100%;
}

.contact input[type="submit"] {
    -moz-border-radius: 3px;
    -moz-transition: .5s all;
    -ms-transition: .5s all;
    -o-transition: .5s all;
    -webkit-appearance: none;
    -webkit-border-radius: 3px;
    -webkit-transition: .5s all;
    background: #ce5a57;
    border: solid 1px #ce5a57;
    border-radius: 3px;
    color: #fff;
    font-size: 1em;
    margin: 1em 0 0 0;
    outline: 0;
    padding: .8em 4em;
    transition: .5s all;
}

.contact input[type="submit"]:hover {
    -moz-transform: scale(.8);
    -moz-transform: scale(.8);
    -o-transform: scale(.8);
    -webkit-transform: scale(.8);
    background: 0;
    color: #ce5a57;
    transform: scale(.8)
}

.contact input[type="text"]:hover, .contact input[type="text"]:valid, .contact textarea:valid, .contact textarea:hover { border-color: #00bcd4 }

.address-cyberinfo {
    -moz-box-shadow: 0 0 25px #00bcd4;
    -webkit-box-shadow: 0 0 25px #00bcd4;
    box-shadow: 0 0 25px #00bcd4;
    margin-top: 3em;
    padding: 1em 0;
}

.address-cyberinfo ul {
    margin: 0;
    padding: 0;
}

.address-cyberinfo ul li {
    color: #151515;
    display: inline-block;
    font-size: 1.1em;
    list-style-type: none;
    text-align: center;
    width: 33%;
}

.address-cyberinfo ul li i.phon {
    color: #ff1493;
    font-family: 'Yanone Kaffeesatz', sans-serif;
    font-size: 1.6em;
    margin-right: .5em;
}

.address-cyberinfo ul li i.glyphicon {
    color: #ff1493;
    font-size: 1em;
    margin-right: .5em
}

.address-cyberinfo ul li a { color: #151515 }

.address-cyberinfo ul li a:hover { color: #43a0d9 }

.address-cyberinfo ul li h4 { color: #ce5a57 }

.well {
    font-size: 14px;
    font-weight: 300;
}

.list-group-item {
    font-size: 14px;
    font-weight: 300;
}

li.list-group-item1 {
    font-size: 14px;
    font-weight: 300
}

.typo p {
    font-size: 14px;
    font-weight: 300;
    margin: 0;
}

.show-grid [class^=col-] {
    background: #fff;
    border: 10px solid #f0f0f0;
    line-height: 2em;
    margin-bottom: 10px;
    text-align: center;
}

.show-grid [class*="col-"]:hover { background: #e0e0e0 }

.grid_3 { margin-bottom: 3em }

.xs h3, h3.m_1 {
    color: #000;
    font-size: 1.7em;
    font-weight: 300;
    margin-bottom: 1em
}

.grid_3 p {
    color: #151515;
    font-size: .85em;
    font-weight: 300;
    margin-bottom: 1em;
}

.grid_4 { background: 0 }

.label {
    border-radius: 4px;
    font-weight: 300 !important;
}

.grid_5 { background: 0 }

.grid_5 h3, .grid_5 h2, .grid_5 h1, .grid_5 h4, .grid_5 h5, h3.w3ls-hdg, h3.bars {
    color: #ce5a57;
    font-weight: bold;
    margin-bottom: 1em;
}

.table > thead > tr > th, .table > tbody > tr > th, .table > tfoot > tr > th, .table > thead > tr > td, .table > tbody > tr > td, .table > tfoot > tr > td { border-top: none !important }

.tab-content > .active {
    display: block;
    visibility: visible
}

.pagination > .active > a, .pagination > .active > span, .pagination > .active > a:hover, .pagination > .active > span:hover, .pagination > .active > a:focus, .pagination > .active > span:focus { z-index: 0 }

.badge-primary { background-color: #03a9f4 }

.badge-success { background-color: #8bc34a }

.badge-warning { background-color: #ffc107 }

.badge-danger { background-color: #e51c23 }

.grid_3 p {
    color: #888;
    font-size: .9em;
    font-weight: 300;
    line-height: 2em;
    margin-bottom: 1em;
}

.bs-docs-example { margin: 1em 0 }

section#tables p { margin-top: 1em }

.tab-container .tab-content {
    background-color: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 0 2px 2px 2px;
    padding: 16px;
}

.table td, .table > tbody > tr > td, .table > tbody > tr > th, .table > tfoot > tr > td, .table > tfoot > tr > th, .table > thead > tr > td, .table > thead > tr > th { padding: 15px !important }

.table > thead > tr > th, .table > tbody > tr > th, .table > tfoot > tr > th, .table > thead > tr > td, .table > tbody > tr > td, .table > tfoot > tr > td {
    border-top: none !important;
    color: #151515;
    font-size: .9em;
}

.tab-content > .active {
    display: block;
    visibility: visible
}

.label { font-weight: 300 !important }

.label {
    border: 0;
    padding: 4px 6px;
    text-shadow: none
}

.alert { font-size: .85em }

h1.t-button, h2.t-button, h3.t-button, h4.t-button, h5.t-button {
    line-height: 2em;
    margin-bottom: .5em;
    margin-top: .5em;
}

li.list-group-item1 { line-height: 2.5em }

.input-group { margin-bottom: 20px }

.in-gp-tl { padding: 0 }

.in-gp-tb { padding-right: 0 }

.list-group { margin-bottom: 48px }

ol { margin-bottom: 44px }

h2.typoh2 { margin: 0 0 10px }

.tab-content > .active {
    display: block;
    visibility: visible
}

.label { font-weight: 300 !important }

.label {
    border: 0;
    padding: 4px 6px;
    text-shadow: none
}

.nav-tabs { margin-bottom: 1em }

h1.t-button, h2.t-button, h3.t-button, h4.t-button, h5.t-button {
    line-height: 1.8em;
    margin-bottom: .5em;
    margin-top: .5em;
}

li.list-group-item1 { line-height: 2.5em }

.input-group { margin-bottom: 20px }

.codes .row { margin: 0 }

.in-gp-tl { padding: 0 }

.in-gp-tb { padding-right: 0 }

.list-group { margin-bottom: 48px }

ol { margin-bottom: 44px }

h2.typoh2 { margin: 0 0 10px }

.form-control1, .form-control_2.input-sm {
    -moz-border-radius: 0;
    -ms-border-radius: 0;
    -o-border-radius: 0;
    -webkit-appearance: none;
    -webkit-border-radius: 0;
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 0;
    box-shadow: none !important;
    color: #616161;
    font-size: .85em;
    font-weight: 300;
    height: 40px;
    outline: 0;
    padding: 5px 18px;
    width: 100%;
}

.control3 { margin: 0 0 1em 0 }

.codes label { font-weight: 400 }

.codes a { color: #151515 }

.icon-box {
    -moz-box-sizing: border-box;
    -moz-transition: .5s all;
    -ms-transition: .5s all;
    -o-transition: .5s all;
    -webkit-box-sizing: border-box;
    -webkit-transition: .5s all;
    background: rgba(149, 149, 149, 0.18);
    border: 5px solid #fff;
    box-sizing: border-box;
    cursor: pointer;
    font-size: 13px;
    margin: 1em 0 1em 0;
    padding: 8px 15px;
    text-align: left;
    transition: .5s all;
}

.icon-box:hover {
    -moz-transition: .5s all;
    -ms-transition: .5s all;
    -o-transition: .5s all;
    -webkit-transition: .5s all;
    background: #5f5f5f;
    transition: .5s all;
}

.icon-box:hover i.fa { color: #fff !important }

.icon-box:hover a.agile-icon { color: #fff !important }

.codes .bs-glyphicons li {
    float: left;
    font-size: 12px;
    height: 115px;
    line-height: 1.4;
    list-style-type: none;
    padding: 10px;
    text-align: center;
    width: 12.5%;
}

.codes .bs-glyphicons .glyphicon {
    font-size: 24px;
    margin-bottom: 10px;
    margin-top: 5px;
}

.codes .glyphicon {
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    color: #777;
    display: inline-block;
    font-family: 'Glyphicons Halflings';
    font-style: normal;
    font-weight: 400;
    line-height: 1;
    position: relative;
    top: 1px;
}

.codes .bs-glyphicons .glyphicon-class {
    display: block;
    text-align: center;
    word-wrap: break-word
}

h3.icon-subheading {
    color: #CE5A57 !important;
    font-size: 30px;
    margin: 30px 0 15px
}

.agileits-icons-title {
    color: #ef2e46;
    font-size: 36px;
    font-weight: 300;
    text-align: center;
}

.icons a { color: #151515 }

.icon-box i {
    color: #282a2b !important;
    font-size: 20px !important;
    margin-right: 10px !important;
}

.icons .bs-glyphicons li {
    background: rgba(149, 149, 149, 0.18);
    float: left;
    font-size: 12px;
    height: 115px;
    line-height: 1.4;
    list-style-type: none;
    margin: 1%;
    padding: 10px;
    text-align: center;
    width: 18%;
}

.icons .bs-glyphicons .glyphicon {
    color: #282a2b;
    font-size: 24px;
    margin-bottom: 10px;
    margin-top: 5px;
}

.icons .glyphicon {
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    color: #777;
    display: inline-block;
    font-family: 'Glyphicons Halflings';
    font-style: normal;
    font-weight: 400;
    line-height: 1;
    position: relative;
    top: 1px;
}

.icons .bs-glyphicons .glyphicon-class {
    display: block;
    text-align: center;
    word-wrap: break-word
}

.tab-content > .active {
    display: block;
    visibility: visible
}

.label { font-weight: 300 !important }

.label {
    border: 0;
    padding: 4px 6px;
    text-shadow: none
}

.nav-tabs { margin-bottom: 1em }

h1.t-button, h2.t-button, h3.t-button, h4.t-button, h5.t-button {
    line-height: 1.8em;
    margin-bottom: .5em;
    margin-top: .5em;
}

li.list-group-item1 { line-height: 2.5em }

.input-group { margin-bottom: 20px }

.codes .row { margin: 0 }

.in-gp-tl { padding: 0 }

.in-gp-tb { padding-right: 0 }

.list-group { margin-bottom: 48px }

ol { margin-bottom: 44px }

h2.typoh2 { margin: 0 0 10px }

.form-control1, .form-control_2.input-sm {
    -moz-border-radius: 0;
    -ms-border-radius: 0;
    -o-border-radius: 0;
    -webkit-appearance: none;
    -webkit-border-radius: 0;
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 0;
    box-shadow: none !important;
    color: #616161;
    font-size: .85em;
    font-weight: 300;
    height: 40px;
    outline: 0;
    padding: 5px 18px;
    width: 100%;
}

.control3 { margin: 0 0 1em 0 }

.codes label { font-weight: 400 }

@media (max-width: 1380px) {
    .about-slid {
        background: linear-gradient(rgba(240, 248, 255, .1), rgba(0, 0, 0, 0.75)), url(../images/enviroment.jpg) no-repeat center fixed;
        background-size: cover;
        padding: 5em 0;
        text-align: center;
    }
    .banner-img3 {
        background: url(../images/cloth.jpg) no-repeat center -350px;
        background-size: cover;
        min-height: 300px;
    }
    .banner-img5 {
        background: linear-gradient(rgba(240, 248, 255, .1), rgba(0, 0, 0, 0.45)), url(../images/world.jpeg) no-repeat center -400px fixed;
        background-size: cover;
        min-height: 300px;
    }
    .banner-img4 {
        background: linear-gradient(rgba(240, 248, 255, .1), rgba(0, 0, 0, 0.45)), url(../images/garden.jpg) no-repeat center -490px;
        background-size: cover;
        min-height: 300px;
    }
}


@media (max-width: 1200px) {
    .banner-img3 {
        background: url(../images/cloth.jpg) no-repeat center -250px;
        background-size: cover;
        min-height: 300px;
    }
    .banner-img5 {
        background: linear-gradient(rgba(240, 248, 255, .1), rgba(0, 0, 0, 0.45)), url(../images/world.jpeg) no-repeat center -270px fixed;
        background-size: cover;
        min-height: 300px;
    }
    .banner-img6 {
        background: linear-gradient(rgba(240, 248, 255, .1), rgba(0, 0, 0, 0.45)), url(../images/long.JPG) no-repeat center -600px fixed;
        background-size: cover;
        min-height: 300px;
    }
}

@media (max-width: 700px) {
    .banner-img3 {
        background: url(../images/cloth.jpg) no-repeat center -250px;
        background-size: cover;
        min-height: 300px;
    }
    .banner-img5 {
        background: linear-gradient(rgba(240, 248, 255, .1), rgba(0, 0, 0, 0.45)), url(../images/world.jpeg) no-repeat center;
        background-size: cover;
        min-height: 300px;
    }
    .banner-img4 {
        background:linear-gradient(rgba(240, 248, 255, .1), rgba(0, 0, 0, 0.45)), url(../images/garden.jpg) no-repeat center;
        background-size: cover;
        min-height: 300px;
    }
    .banner-img6 {
        background: linear-gradient(rgba(240, 248, 255, .1), rgba(0, 0, 0, 0.45)), url(../images/long.JPG) no-repeat center ;
        background-size: cover;
        min-height: 300px;
    }
}

@media (max-width: 1500px) {
    .banner-img6 {
        background: url(../images/long.JPG) no-repeat center -250px;
        background-size: cover;
        min-height: 300px;
    }
   
}




@media (max-width: 1080px) {
    .icon-box { padding: 8px 9px }

    .about-slid {
        background: linear-gradient(rgba(240, 248, 255, .1), rgba(0, 0, 0, 0.75)), url(../images/enviroment.jpg) no-repeat center fixed;
        background-size: cover;
        padding: 5em 0;
        text-align: center;
    }
    .banner-img3 {
        background: url(../images/cloth.jpg) no-repeat center -200px;
        background-size: cover;
        min-height: 300px;
    }
    .banner-img4 {
        background: linear-gradient(rgba(240, 248, 255, .1), rgba(0, 0, 0, 0.45)), url(../images/garden.jpg) no-repeat center;
        background-size: cover;
        min-height: 300px;
    }
}

@media (max-width: 768px) {
    .about-slid {
        background: linear-gradient(rgba(240, 248, 255, .1), rgba(0, 0, 0, 0.75)), url(../images/enviroment.jpg) no-repeat center;
        background-size: cover;
        padding: 5em 0;
        text-align: center;
    }
    .banner-img3 {
        background: url(../images/cloth.jpg) no-repeat center -150px;
        background-size: cover;
        min-height: 300px;
    }
    .banner-img4 {
        background: linear-gradient(rgba(240, 248, 255, .1), rgba(0, 0, 0, 0.45)), url(../images/garden.jpg) no-repeat center;
        background-size: cover;
        min-height: 300px;
    }
    .grid_5 { padding: 0 0 1em }

    .grid_3 { margin-bottom: 0 }

    .cyber_elite {
        color: #ce5a57;
        font-size: 1.45em;
        font-weight: 400;
        margin-top: -1em;
        padding-bottom: 1em;
        text-align: center;
    }
    .banner-img6 {
        background: url(../images/long.JPG) no-repeat center -50px;
        background-size: cover;
        min-height: 300px;
    }

}

@media (max-width: 640px) {
    .cyber_elite {
        color: #ce5a57;
        font-size: 1.4em;
        font-weight: 400;
        margin-top: -1em;
        padding-bottom: .75em;
        text-align: center;
    }
    .banner-img3 {
        background: url(../images/cloth.jpg) no-repeat center;
        background-size: cover;
        min-height: 300px;
    }
    .about-slid {
        background: linear-gradient(rgba(240, 248, 255, .1), rgba(0, 0, 0, 0.75)), url(../images/enviroment.jpg) no-repeat center;
        background-size: cover;
        padding: 5em 0;
        text-align: center;
    }

    h1, .h1, h2, .h2, h3, .h3 {
        margin-bottom: 0;
        margin-top: 0;
    }

    .grid_5 h3, .grid_5 h2, .grid_5 h1, .grid_5 h4, .grid_5 h5, h3.hdg, h3.bars { margin-bottom: .5em }

    .progress {
        height: 10px;
        margin-bottom: 10px
    }

    ol.breadcrumb li, .grid_3 p, ul.list-group li, li.list-group-item1 { font-size: 14px }

    .breadcrumb { margin-bottom: 25px }

    .well {
        font-size: 14px;
        margin-bottom: 10px
    }

    h2.typoh2 { font-size: 1.5em }

    .label { font-size: 60% }

    .in-gp-tl { padding: 0 1em }

    .in-gp-tb { padding-right: 1em }
}

@media (max-width: 350px) {
    .cyber_elite {
        color: #ce5a57;
        font-size: 1em;
        font-weight: 400;
        margin-top: -1em;
        padding-bottom: .75em;
        text-align: center;
    }


    .banner-img3 {
        background: url(../images/cloth.jpg) no-repeat center ;
        background-size: cover;
        min-height: 300px;
    }

    .banner-img6 {
        background: url(../images/long.JPG) no-repeat center;
        background-size: cover;
        min-height: 300px;
    }

}

@media (max-width: 480px) {
    .cyber_elite {
        color: #ce5a57;
        font-size: 1.25em;
        font-weight: 400;
        margin-top: -1em;
        padding-bottom: .75em;
        text-align: center;
    }
    .banner-img3 {
        background: url(../images/cloth.jpg) no-repeat center ;
        background-size: cover;
        min-height: 300px;
    }
    .banner-img6 {
        background: url(../images/long.JPG) no-repeat center;
        background-size: cover;
        min-height: 300px;
    }

    h3.w3ls-hdg {
        font-size: 1.6em;
        margin: 1em 0 .6em
    }

    .grid_5 h3, .grid_5 h2, .grid_5 h1, .grid_5 h4, .grid_5 h5, h3.hdg, h3.bars { font-size: 1.2em }

    .table h1 { font-size: 26px }

    .table h2 { font-size: 23px }

    .table h3 { font-size: 20px }

    .label { font-size: 53% }

    .codes .alert {
        font-size: .9em;
        padding: 10px
    }

    .pagination { margin: 20px 0 0 }

    .grid_3.grid_4.w3layouts { margin-top: 0 }

    .agileits-icons-title { font-size: 30px }

    h3.icon-subheading { font-size: 22px }

    .icons .bs-glyphicons li { width: 31% }
}

@media (max-width: 320px) {
    .alert, ol.breadcrumb li, .grid_3 p, .well, ul.list-group li, li.list-group-item1, a.list-group-item { font-size: 13px }

    .alert {
        margin-bottom: 10px;
        padding: 10px;
    }

    ul.pagination li a {
        font-size: 1em;
        padding: 5px 11px !important
    }

    .list-group { margin-bottom: 10px }

    .well { padding: 10px }

    .table > thead > tr > th, .table > tbody > tr > th, .table > tfoot > tr > th, .table > thead > tr > td, .table > tbody > tr > td, .table > tfoot > tr > td { font-size: .81em }

    .table td, .table > tbody > tr > td, .table > tbody > tr > th, .table > tfoot > tr > td, .table > tfoot > tr > th, .table > thead > tr > td, .table > thead > tr > th { padding: 13px !important }

    .codes .row { margin: 0 }

    .agileits-icons-title { font-size: 25px }

    h3.icon-subheading {
        font-size: 18px;
        margin: 21px 0 12px
    }
}

.modal-open .modal { background: rgba(0, 0, 0, 0.48) }

.modal-body { padding: 0 2em 2.5em }

.modal-dialog { margin: 6em auto 0 }

.modal-body h4 {
    color: #ce5a57;
    font-size: 1.6em;
    font-weight: 300;
    margin: 1em 0 .3em
}

.bnr-modal .modal-header {
    border: 0;
    min-height: 2.5em;
    padding: .5em 2em 0
}

.bnr-modal button.close {
    color: #ce5a57;
    font-size: 2.5em;
    opacity: .9;
    outline: 0
}

.modal-body p { font-weight: 300 }

#toTop {
    background: url("../images/move-up.png") no-repeat 0 0;
    border: 0;
    bottom: 3%;
    display: none;
    height: 32px;
    overflow: hidden;
    position: fixed;
    right: 3%;
    text-decoration: none;
    text-indent: 100%;
    width: 32px;
}

#toTopHover {
    -moz-opacity: 0;
    display: block;
    filter: alpha(opacity=0);
    float: right;
    height: 32px;
    opacity: 0;
    overflow: hidden;
    width: 32px;
}

@media (max-width: 1366px) {
    .banner-schooltext h3, .banner-schooltext h2 { font-size: 5.5em }

    .banner-schooltext { padding-top: 25% }

    .about-cyberbanner .banner-img1 { min-height: 260px }
}

@media (max-width: 1280px) {
    .banner-schooltext h3, .banner-schooltext h2 { padding-left: 1em }
}

@media (max-width: 1080px) {
    .banner-schooltext h3, .banner-schooltext h2 {
        font-size: 5em;
        padding-left: 0;
    }

    .banner-schooltext { padding-top: 30% }

    h3.cyber-title {
        font-size: 3.5em;
        padding: 1.5em 1em;
    }

    h3.cyber-title1 { font-size: 3.5em }

    .about, .news, .services, .testimonial, .about, .team, .contact, .gallery, .codes { padding: 4em 0 }

    .services-grid { padding: 0 2em }

    .footer-grid input[type="submit"] { padding: .8em 1em }

    .footer h3 { font-size: 2.2em }

    .about-cyberbanner .banner-img1 { min-height: 230px }

    .pince-left { width: 21% }

    .about-slid h5 { letter-spacing: 8px }

    .img-cyberinfo-text { padding: 1.5em 1.5em 0 }

    .team-grids:hover div.img-caption::before, .img-cyberinfo-text { width: 87.5% }

    .team-grids:hover div.img-caption::before { height: 57% }

    .team-grids:hover div.img-cyberinfo-text { top: 46% }

    .img-cyberinfo-text { padding: 1em 1em 0 }

    [class^='imghvr-'] .cyber-figurecaption, [class*=' imghvr-'] .cyber-figurecaption { padding: 3.3em 2.5em }

    [class^='imghvr-'] .cyber-figurecaption h4 { margin-bottom: .2em }
}

@media (max-width: 991px) {
    .navbar-header h1 { font-size: 3em }

    .navbar-nav > li { margin-right: 2em }

    .banner-schooltext h3, .banner-schooltext h2 { font-size: 4.5em }

    .banner-img1, .banner-img2 { min-height: 600px }

    .about-cyberbanner .banner-schooltext { padding-top: 6% }

    h3.cyber-title {
        font-size: 3em;
        padding: 0 0 .8em;
    }

    .news-schoolright { margin-top: 1.5em }

    .news-cyberinfo.btm-newsrow { margin-top: 3em }

    .news-schoolleft.news-cyberleft1 { float: none }

    .services-grid { padding: 0 1em }

    .cyberspace-slide h4 { font-size: 3.5em }

    .cyberspace-slide p { width: 95% }

    .footer-grid.footer-tags { margin-bottom: 4em }

    ul.nav.navbar-nav.navbar-left { margin-top: .9em }

    .about-cyberbanner .banner-schooltext h2 { font-size: 4em }

    .about-cyberbanner .banner-img1 { min-height: 190px }

    .about-cyberspaceprogrids img { width: 50% }

    .about-cyberspaceprogrids:nth-child(2) { padding: 0 1em }

    .about-cyberspaceprogrids:nth-child(3) { margin: 3em 0 }

    .about-slid h5 {
        font-size: 2.2em;
        letter-spacing: 6px;
    }

    .about-slid { padding: 4em 0 }

    h3.cyber-title1 { margin-bottom: .8em }

    .team-w3ls-row {
        margin: 0 auto;
        width: 67%;
    }

    .team-grids:nth-child(3), .team-grids:nth-child(4) { margin-top: 2em }

    .w3gallery-grids { padding: .3em .5em }

    [class^='imghvr-'] .cyber-figurecaption h4 { font-size: 2em }

    [class^='imghvr-'] .cyber-figurecaption, [class*=' imghvr-'] .cyber-figurecaption { padding: 2.3em .5em }

    .contact-left iframe { min-height: 24em }

    .contact-right { margin-top: 2em }

    .address-cyberinfo ul li {
        font-size: 1em;
        width: inherit
    }
}

@media (max-width: 900px) {
    .banner-schooltext { width: 83% }
}

@media (max-width: 800px) {
    .banner-schooltext h3, .banner-schooltext h2 { font-size: 4em }

    .banner-img1, .banner-img2 { min-height: 510px }

    .banner-img3, .banner-img4 { max-height: 15% }
    .double {
        display: none;
    }
}
@media (max-width: 999px) {
    

    .triple {
        display: none;
    }
}

@media (max-width: 768px) {
    .navbar-header h1 { font-size: 2.6em }

    .navbar-header h1 a span { letter-spacing: 2px }

    .cyberspace-slide h4 { font-size: 3.2em }

    .cyberspace-test-top { min-height: 130px }

    .cyberspace-test-bottom { padding: 1.5em }

    .cyberspace-test h4 { font-size: 1.6em }

    .navbar-nav > li > a { font-size: 1em }

    .contact-left iframe { min-height: 20em }
}

@media (max-width: 767px) {
    .headerBar { padding: 1.5em 1em 1.1em }

    .navbar-header.navbar-left {
        float: left;
        margin: 0
    }

    .header-text {
        float: left;
        margin-left: 3em;
        width: 21%
    }

    .agileits-topnav {
        display: inline-block;
        margin: .9em 0 0 3em;
    }

    ul.nav.navbar-nav.navbar-left {
        display: table;
        float: none !important;
        margin: 0 auto;
        text-align: center;
    }

    .navbar-header h1 { margin: 0 }

    .navbar-header h1 a span {
        font-size: .36em;
        letter-spacing: 2px;
        margin-top: .5em
    }

    .navbar-nav > li { margin: 1em 0 0 0 }

    .navbar-nav > li:nth-child(5) { margin: 1em 0 }

    nav.navbar.navbar-default { margin-bottom: 0 }

    .header-right { float: none }

    .navbar-default .navbar-toggle {
        border-color: #ce5a57;
        margin: 14px 0 0
    }

    .navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus { background-color: #ce5a57 }

    .navbar-default .navbar-toggle .icon-bar { background-color: #ce5a57 }

    .navbar-default .navbar-toggle:hover .icon-bar, .navbar-default .navbar-toggle:focus .icon-bar { background-color: #fff }

    .social-icons ul li a.fa { line-height: 2.2em }

    .icon {
        height: 30px;
        width: 30px;
    }

    div#bs-example-navbar-collapse-1 {
        -moz-box-shadow: 0 2px 1px rgba(0, 0, 0, 0.34);
        -ms-box-shadow: 0 2px 1px rgba(0, 0, 0, 0.34);
        -o-box-shadow: 0 2px 1px rgba(0, 0, 0, 0.34);
        -webkit-box-shadow: 0 2px 1px rgba(0, 0, 0, 0.34);
        background: rgba(0, 0, 0, 0.82);
        box-shadow: 0 2px 1px rgba(0, 0, 0, 0.34);
        left: 0;
        margin: 5.6em 0 0;
        position: absolute;
        width: 100%;
        z-index: 9999;
    }

    .modal-dialog {
        margin: 4em auto;
        width: 80%
    }

    .modal { padding: 0 !important }

    .navbar-default .navbar-nav .open .dropdown-menu > li > a { color: #fff }
}

@media (max-width: 736px) {
    .services-grid p {
        margin: 0 auto;
        width: 65%;
    }

    .services-grid:nth-child(2) { margin: 2em 0 }

    .footer-grid { padding: 0 }

    .footer-grid.footer-tags { margin: 2.5em 0 }

    .footer h3 { margin-bottom: .4em }

    .footer-grid.footer-review { margin-bottom: 2.5em }

    .banner-schooltext h3, .banner-schooltext h2 { font-size: 3.6em }

    .banner-schooltext { padding-top: 34% }

    .footer-grid input[type="submit"] { padding: .8em 2em }

    .about-cyberbanner .banner-schooltext h2 { font-size: 3.5em }

    .about-cyberbanner .banner-img1 { min-height: 145px }

    .pince-left { width: 14% }

    .pince-right { width: 82% }

    .about-slid h5 {
        font-size: 2em;
        letter-spacing: 4px;
    }

    .team-w3ls-row { width: 40% }

    .team-grids:hover div.img-caption::before, .img-cyberinfo-text { width: 89% }

    .team-grids:hover div.img-cyberinfo-text { top: 49% }

    .team-grids:nth-child(2) { margin-top: 2em }

    [class^='imghvr-'] .cyber-figurecaption, [class*=' imghvr-'] .cyber-figurecaption { padding: 4.3em 3.5em }
}

@media (max-width: 568px) {
    .banner-schooltext h2 { padding-top: 20% }
}

@media (max-width: 667px) {
    .banner-schooltext {
        padding-top: 38%;
        width: 87%;
    }

    .flip-content { width: 240px }

    .team-w3ls-row { width: 45% }

    [class^='imghvr-'] .cyber-figurecaption, [class*=' imghvr-'] .cyber-figurecaption { padding: 3.5em 2em }

    .address-cyberinfo ul li {
        display: block;
        margin: 0;
    }

    .address-cyberinfo ul li:nth-child(2) { margin: 1em 0 }
}

@media (max-width: 600px) {
    .banner-schooltext h3, .banner-schooltext h2 { font-size: 3.2em }

    .banner-img1, .banner-img2 { min-height: 460px }

    .about, .news, .services, .testimonial, .about, .team, .contact, .gallery, .codes { padding: 3.5em 0 }

    h3.cyber-title { font-size: 2.5em }

    h3.cyber-title1 { font-size: 3em }

    .about p { margin-top: 1em }

    .flip-content { width: 235px }

    h3.cyberspacetitle { font-size: 2em }

    .team-w3ls-row { width: 50% }

    [class^='imghvr-'] .cyber-figurecaption, [class*=' imghvr-'] .cyber-figurecaption { padding: 3em 1.5em }

    .contact-left iframe { min-height: 16em }

    .contact textarea { min-height: 11em }

    .contact input[type="text"] { margin-bottom: 1em }

    .modal-dialog {
        margin: 2em auto;
        width: 90%
    }
}

@media (max-width: 568px) {
    .banner-schooltext h3, .banner-schooltext h2 { font-size: 2.8em }

    .banner-img1, .banner-img2 { min-height: 425px }

    .cyberspace-test-bottom { padding: 1em }

    .flip-content { width: 215px }

    .team-w3ls-row { width: 54% }

    .about-cyberbanner .banner-schooltext h2 { font-size: 3em }

    .about-cyberbanner .banner-img1 { min-height: 115px }
}

@media (max-width: 480px) {
    .navbar-header h1 { font-size: 2.4em }

    .banner-schooltext h3, .banner-schooltext h2 { font-size: 2.5em }

    .banner-img1, .banner-img2 { min-height: 370px }

    a.montessoribtn { padding: .7em 1.5em }

    .about, .news, .services, .testimonial, .about, .team, .contact, .gallery, .codes { padding: 3em 0 }

    h3.cyber-title {
        font-size: 2.3em;
        padding: 0 0 .6em
    }

    .about h4 {
        font-size: 1.6em;
        margin-bottom: .2em
    }

    .about p { margin-top: .5em }

    .news-schoolleft h4 { font-size: 1.8em }

    .news-schoolleft p { width: 100% }

    .services-grid p { width: 95% }

    .cyberspace-slide h4 { font-size: 2.5em }

    .cyberspace-slide p { width: 100% }

    .flip-content {
        margin: 0 auto !important;
        width: 236px;
    }

    .about-slid h5 {
        font-size: 1.5em;
        letter-spacing: 3px;
    }

    .about-slid { padding: 3em 0 }

    .team-w3ls-row { width: 62% }

    .about-cyberbanner .banner-schooltext h2 { font-size: 2.5em }

    .about-cyberbanner .banner-img1 { min-height: 100px }

    [class^='imghvr-'] .cyber-figurecaption, [class*=' imghvr-'] .cyber-figurecaption { padding: 1.6em .6em }

    .contact input[type="text"] { padding: .6em 1em }

    .modal-body { padding: 0 1.5em 1.5em }
}

@media (max-width: 414px) {
    .headerBar { padding: 1.5em 0 1.1em }

    div#bs-example-navbar-collapse-1 { margin: 5.1em 0 0 }

    .banner-schooltext h3, .banner-schooltext h2 { font-size: 2em }

    a.montessoribtn {
        font-size: .9em;
        padding: .7em 1.8em;
    }

    .banner-img1, .banner-img2 { min-height: 330px }

    .about-left, .about-right { padding: 0 }

    p, .about-right ul li { font-size: .9em }

    h3.cyber-title1 { font-size: 2.6em }

    .news-schoolleft h4 { font-size: 1.6em }

    .news-schoolleft h6 {
        font-size: 1.1em;
        margin: .5em 0 .5em
    }

    .news-cyberinfo.btm-newsrow { margin-top: 2em }

    .services-cyberrow { margin-top: 2em }

    .services h5 { font-size: 1.5em }

    .services-grid p { width: 100% }

    .cyberspace-slide { padding: 2.5em 0 }

    .flip-content { width: 220px }

    .cyberspace-test-top { min-height: 100px }

    .team-w3ls-row { width: 77% }

    .w3gallery-grids {
        float: none;
        width: 100%
    }

    [class^='imghvr-'] .cyber-figurecaption, [class*=' imghvr-'] .cyber-figurecaption { padding: 4.6em 2em }

    .contact-left.cyberspacepro, .contact-right { padding: 0 }

    .contact input[type="submit"] {
        font-size: .9em;
        padding: .7em 3em;
    }

    .about-cyberspaceprogrids:nth-child(2) { padding: 0 }

    .about-cyberspaceprogrids:nth-child(3) {
        margin: 2em 0;
        padding: 0
    }

    .about-cyberspaceprogrids img { width: 80% }

    .cyber-pi { margin-top: 1.5em }

    .about-cyberspaceprogrids { padding: 0 }

    .pince-left { width: 19% }

    .pince-right { width: 75% }

    .about h4 { font-size: 1.4em }

    .about-slid h5 {
        font-size: 1.2em;
        letter-spacing: 2px;
    }

    .team-w3ls-row { width: 85% }

    .footer-grid input[type="submit"] { padding: .8em 1.5em }

    .footer-grid li a { font-size: .9em }

    .footer h3 { font-size: 2em }

    .footer { padding: 2em 0 }

    .copy-right { padding: 1.5em 0 }

    .about-cyberbanner .banner-schooltext h2 { font-size: 2em }

    .about-cyberbanner .banner-img1 { min-height: 80px }

    .navbar-default .navbar-toggle { margin: 7px 0 0 }

    .navbar-nav > li > a { line-height: 29px }

    .news-schoolleft, .news-schoolright { padding: 0 }

    .sl-wrapper .sl-navigation button { width: 25px !important }

    .sl-wrapper .sl-navigation button.sl-next { right: 3px !important }

    .sl-wrapper .sl-navigation button.sl-prev { left: 3px !important }

    .services-grid { padding: 0 }
}

@media (max-width: 384px) {
    .cyberspace-slide h4 { font-size: 2.2em }

    .cyberspace-test h6 { font-size: 1.1em }

    .modal-dialog { width: 95% }

    .modal-body h4 {
        font-size: 1.4em;
        margin: .5em 0 .3em
    }

    .headerBar { padding: 1.1em 0 }
}

@media (max-width: 320px) {
    .navbar-header h1 { font-size: 2.1em }

    .modal-body { padding: 0 1em 1.5em }

    .modal-dialog { margin: 1em auto }

    div#bs-example-navbar-collapse-1 { margin: 4.7em 0 0 }

    .about, .news, .services, .testimonial, .about, .team, .contact, .gallery, .codes { padding: 2em 0 }

    h3.cyber-title { font-size: 2em }

    h3.cyber-title1 { font-size: 2.2em }

    .services h5 { font-size: 1.3em }

    .cyberspace-slide h4 { font-size: 2em }

    .flip-content { width: 190px }

    .banner-img1, .banner-img2 { min-height: 270px }

    .banner-schooltext h3, .banner-schooltext h2 { font-size: 1.7em }

    h3.cyber-title { font-size: 1.8em }

    .footer-grid input[type="submit"] { padding: .8em 1.1em }

    h3.cyberspacetitle { font-size: 1.8em }

    .cyber-pi h5 { font-size: 1.6em }

    .team-grids { padding: 0 }

    .team-grids:hover div.img-caption::before, .img-cyberinfo-text { width: 100% }

    .about-cyberbanner .banner-schooltext h2 { font-size: 1.8em }

    .w3gallery-grids { padding: .3em 0 }

    [class^='imghvr-'] .cyber-figurecaption, [class*=' imghvr-'] .cyber-figurecaption { padding: 3.6em 2em }

    .footer h3 { font-size: 1.8em }

    .footer-grid.footer-tags { margin: 1.5em 0 }

    .footer-grid.footer-review { margin-bottom: 1.5em }

    .sl-wrapper .sl-navigation button.sl-prev { left: -4px !important }

    .sl-wrapper .sl-navigation button.sl-next { right: -4px !important }

    .footer-grid input[type="email"] { padding: .6em }

    .footer-grid input[type="submit"] { padding: .6em 1em }
}

.half {
    float: left;
    padding: 0 1em;
    width: 50%;
}

.tab {
    color: #fff;
    margin-bottom: 1px;

    position: relative;
    width: 100%;
}

.tab input {
    opacity: 0;
    position: absolute;
    z-index: -1
}

label {
    background: #ce5a57;
    cursor: pointer;
    display: block;
    font-weight: bold;
    line-height: 3;
    padding: 0 0 0 1em;
    position: relative;
    text-align: center
}

.blue label { background: #2980b9 }

.tab-content {
    -o-transition: max-height .35s;
    -webkit-transition: max-height .35s;
    background: #ce5a57;
    max-height: 0;
    overflow: hidden;
    transition: max-height .35s
}

.blue .tab-content { background: #3498db }

.tab-content p {
    color: #fff;
    margin: .5em 1em 1em;
}

.tab input:checked ~ .tab-content { max-height: 45em }

label::after {
    -o-transition: all .35s;
    -webkit-transition: all .35s;
    display: block;
    height: 3em;
    line-height: 3;
    position: absolute;
    right: 0;
    text-align: center;
    top: 0;
    transition: all .35s;
    width: 3em;
}

.tab input[type=checkbox] + label::after { content: "+" }

.tab input[type=radio] + label::after { content: "\25BC" }

.tab input[type=checkbox]:checked + label::after { transform: rotate(315deg) }

.tab input[type=radio]:checked + label::after { transform: rotateX(180deg) }