/* Unessential CSS - Just here to make this sample page prettier */

html, body {
    height: 100%;
}
body {
    margin: 0;
    font-size: 16px;
    font-family: 'Roboto', sans-serif;
    line-height: 1.5;

}
.wrapper {
    margin: 0 auto;
    max-width: 1060px;
    padding: 1px 3em;
    height: 100%;
}
header {
    background: url( ../images/main-slider/2.png) no-repeat top left;
	background-size: 100%
}
header:after {
    content: " ";
    display: table;
    clear: both;
}
.brand, h1, h2, h3 {
     font-family: 'Roboto Condensed', sans-serif;
     font-weight: 400;
     letter-spacing: 1px;
 }
h4, h5, h6 {
    letter-spacing: 1px;
}
h1 {
    font-size: 28px;
}

.main .dev-output pre {
    overflow: auto;
    max-height: 500px;
    background-color: #EBF4FD;
    padding: 0 1em 1em;
}
.brand {
    float: left;
    height: 80px;
}
.brand p {
    margin: 0;
}
.rm-nav {
    letter-spacing: 1px;
}
.logo {
    font-size: 1.4em;
    line-height: 40px;
    margin: 10px 0 0;
    text-align: center;
    font-weight: bold;
    letter-spacing: 2px;
    display: block;
    float: left;
    text-decoration: none;
    color: #fff;
    padding: 0;
}

.rm-toggle.rm-button {
    margin-top: 25px;
}

.rm-css-animate.rm-menu-expanded {
    max-height: none;
    display: block;
}
.rm-container.rm-layout-expanded {
    float: right;
}
.rm-nav li a,
.rm-top-menu a {
    padding: .75rem 1rem;
    font-size: .9em;
    line-height: 1.5rem;
    text-transform: uppercase;
}
.rm-layout-expanded .rm-nav > ul > li > a,
.rm-layout-expanded .rm-top-menu > .rm-menu-item > a {
    height: 80px;
    line-height: 80px;
}

.main {
    background-image: url("../images/cloud.jpg");
    background-position: center top;
    background-repeat: repeat-x;
    min-height: 100%;
    padding-top: 1px;
}
.tagline {
    width: 360px;
    font-size: 1.75em;
    font-weight: bold;
    letter-spacing: 2px;
    line-height: 1.2;
    text-align: center;
    margin: 275px auto;
    color: #1A88D3;
}
.tagline strong {
    font-size: 1.3em;
}
.dev-output {
    background-color: #e1eaf3; /* fall-back */
    background-color: rgba(255,255,255,1);
    color: #000;
    padding: 2em;
    margin-bottom: 2em;
}
.sccontentbox {padding:50px 0;}
.scleftnav {float:left;width:25%;}
.scrightmain {float:right;width:72%;line-height:180%;}
.scleftul {padding:0px;background:#f2f2f2;border-radius:10px 10px 0 0;}
.scleftul li {list-style:none;border-bottom:1px solid #ccc;}
.scleftul li a{padding:10px 15px;display:block;color:#333;}
.scleftul li a:hover{background:#224d77;color:#fff;}
.scleftul li h3 {background:#224d77;color:#fff;padding:20px;border-radius:10px 10px 0 0;}
.scleftul li h3 span{border-bottom:2px solid #fff;}
.scleftul li h4 {background:#224d77;color:#fff;padding:20px;border-radius:0 0 10px 10px;}
.scphotoh3 {margin-bottom:30px;}
.scphotoshow {width:45%;float:left;}
.scphotoshow img{width:100%;}
.scphotojj {width:53%;float:right;}
.scbt {background:#f2f2f2;padding:15px;}
.sctext {padding:15px;}
.sctext img {max-width:100%;}
.scnav {margin-bottom:10px;font-size:12px;}
.scnav a{color:#333;}
.scnewstitle {text-align:center;font-size:16px;font-weight:bold;border-bottom:1px solid #ccc;padding:15px 0;}
.scnewstime {text-align:center;font-size:12px;color:#ccc;}
@media (max-width:575.98px){
	.scleftnav {width:100%;}
    .scrightmain {width:100%;padding:30px 0;}
	.scphotoshow {width:100%;}
	.scphotojj {width:100%;}
}