.mobile-only { display: none !important; }

@media(max-width: 1025px){
.mobile-only { display: inline-block!important; }
.nav-trigger { position: absolute; top: 25px; right: 20px; display: none; width: 30px; height: 26px; }
.nav-trigger span { position: absolute; display: block; height: 2px; width: 100%; background: #fff; transition: top .2s .25s, left .2s .25s, opacity .2s .25s, transform .2s 0s; }
.nav-trigger span:nth-child(1) { top: 0; }
.nav-trigger span:nth-child(2) { top: 9px; }
.nav-trigger span:nth-child(3) { top: 19px; }
.nav-trigger.active span { transition: background .2s, top .2s, left .2s, opacity .2s, transform .2s .25s; }
.nav-trigger.active span:nth-child(3),
.nav-trigger.active span:nth-child(1) { top: 12px; }
.nav-trigger.active span:nth-child(2) { opacity: 0; }
.nav-trigger.active span:nth-child(1) { transform: rotate(45deg); }
.nav-trigger.active span:nth-child(3) { transform: rotate(-45deg); }
    /* ------------------------------------------------------------ *\
        Base
    \* ------------------------------------------------------------ */
    
    * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }

    body { min-width: 320px; }

    img { max-width: 100%; height: auto; }

    /* ------------------------------------------------------------ *\
        Wrapper
    \* ------------------------------------------------------------ */
    
    #wrapper { width: auto; padding: 0; margin: 0 10px 50px; background: #fff; box-shadow: 0 0 20px #0c75c6; }

    /* ------------------------------------------------------------ *\
        Banner
    \* ------------------------------------------------------------ */
    
    #banner {width: 100%;top: 0!important;z-index: 100!important;height: 70px!important;}
    #banner #masthead { width: 100%;}
    #banner #masthead img#mmy { height: 70px!important;width:auto!important; }
    #banner #masthead .button { display: none!important; }
    #masthead #title { width: 400px;left: 75px;top: 18px; }
    #masthead #subtitle  {width: 397px;max-width: 100%;left: 75px;top: 48px;}
    #banner #masthead .button { height: auto; padding-top: 5px; padding-bottom: 5px; }

    /* ------------------------------------------------------------ *\
        Content
    \* ------------------------------------------------------------ */
    
    #content { width: 100%; padding-left: 10px; padding-right: 10px; height: auto; }
    #content #home_quote { left: 0; width: 100%; height: auto; max-width: 686px; }
    #content #home_subtitle { width: 100%; left: 0; height: auto; margin-left: 0; }
    #content #callout { width: 100%; }
    #content .right { margin-left: 20px; margin-bottom: 10px; width: 300px; }
    #content .right .filler { width: 100%; }
    #content .right .filler .bt ul li { padding-right: 15px; }
    #content .right .filler .bt ul a { display: inline-block; background-position: right center; }

    #content .welcome { width: 100%; margin: 0; padding: 130px 30px 30px; }

   /* #gradient #content:not(.content-secondary) { padding-bottom: 30%; background: url(/images/stars.jpg) no-repeat 0 0; -webkit-background-size: cover; background-size: cover; position: relative; }
    #gradient #content:not(.content-secondary):before { content: ''; background: url(/images/planets.png) no-repeat 0 0; width: 100%; height: 0; padding-bottom: 19.2%; display: inline-block; position: absolute; top: 0; left: 0; -webkit-background-size: cover; background-size: cover; }
    #gradient #content:not(.content-secondary):after { content: ''; background: url(/images/welcome-bottom.png) no-repeat 0 0; width: 100%; height: 0; padding-bottom: 52.3%; position: absolute; bottom: 0; left: 0; -webkit-background-size: cover; background-size: cover; }*/
    #gradient #content .welcome { position: relative; z-index: 1; }
    
    #gradient #topnav { background: none !important; }

    /* ------------------------------------------------------------ *\
        Top Nav
    \* ------------------------------------------------------------ */
    
    .nav-trigger { display: inline-block; }
    #topnav { width: 100%; left: 0; height: auto; padding-bottom: 20px; }
    #topnav ul { width: 100%; position: static; text-align: center; height: auto; }
    #topnav ul:after { content: ''; line-height: 0; display: table; clear: both; }
    #topnav ul li { float: none; display: inline-block; vertical-align: middle; margin: 0 3px 10px; }

    #topnav { background: #60aedd; padding: 20px 20px 10px; text-align: center; opacity: 0; visibility: hidden; -webkit-transition: all .3s; -o-transition: all .3s; transition: all .3s; top: 70px;border-top:1px solid #fff!important; }
    #topnav.active { position: fixed; opacity: 1; visibility: visible;z-index: 150!important; }
    #topnav ul li { display: block; margin: 15px 0; }
    #topnav ul li + li { margin-left: 0; }
    
    #masthead .button { display:none!important; }
     #topnav .button { background: #ce2b06; color: #fff; text-decoration: none; text-transform: uppercase; display: block; width: 197px; font: 16px/20px MyriadProLight,sans-serif; margin: 0; margin-left: 10px; height: auto; padding: 5px; margin-bottom: 10px; }
    #topnav .button span { background-image: url(/images/arrow-buttons.png); background-repeat: no-repeat; background-position: right 3px; padding-right: 16px; }
    #topnav .button .sm { font: 11px/14px MyriadPro,sans-serif; letter-spacing: 1px; background: none;display:block; }    


    /* ------------------------------------------------------------ *\
        Photos
    \* ------------------------------------------------------------ */
    
    .photos { float: none; height: auto; }
    .photos:after { content: ''; line-height: 0; display: table; clear: both; }
    .photos img { width: 50%; float: left; }
    .photos img:first-child { width: 42%; }
    .photos img ~ img { margin-left: 4%; }

    /* ------------------------------------------------------------ *\
        Bottom
    \* ------------------------------------------------------------ */
    
    #bottom { display: none; }

    /* ------------------------------------------------------------ *\
        Copyright
    \* ------------------------------------------------------------ */
    
    div#copyright { width: 100%; padding-bottom: 40px; }
    div#copyright img { left: 0; max-width: 48%; height: auto; }
    div#copyright p { width: 50%; margin-left: 50%; padding-right: 15px; }

    /* ------------------------------------------------------------ *\
        Cookie Bar
    \* ------------------------------------------------------------ */
    
    #cookie-bar.fixed.bottom { width: 100%; height: auto; }
}

@media(max-width: 780px){
    /* ------------------------------------------------------------ *\
        Helpers
    \* ------------------------------------------------------------ */
    
    .mobile-only { display: inline-block !important; }
    .desktop { display: none!important; }



    /* ------------------------------------------------------------ *\
        Topnav
    \* ------------------------------------------------------------ */
    
    #topnav { background: #60aedd; padding: 20px 20px 10px; text-align: center; opacity: 0; visibility: hidden; -webkit-transition: all .3s; -o-transition: all .3s; transition: all .3s; top: 70px; }
    #topnav.active { opacity: 1; visibility: visible; }
    #topnav ul li { display: block; margin: 15px 0; }
    #topnav ul li + li { margin-left: 0; }
    
    #topnav .button { background: #ce2b06; color: #fff; text-decoration: none; text-transform: uppercase; display: block; width: 197px; font: 16px/20px MyriadProLight,sans-serif; margin: 0; margin-left: 10px; height: auto; padding: 5px; margin-bottom: 10px; }
    #topnav .button span { background-image: url(/images/arrow-buttons.png); background-repeat: no-repeat; background-position: right 3px; padding-right: 16px; }
    #topnav .button .sm { font: 11px/14px MyriadPro,sans-serif; letter-spacing: 1px; background: none;display:block; }

    /* ------------------------------------------------------------ *\
        Content
    \* ------------------------------------------------------------ */
    
    #content h1 { font-size: 26px !important; line-height: 1.3 !important; }
    #content h2 { font-size: 24px !important; line-height: 1.3 !important; }
    #content h4 { font-size: 28px !important; line-height: 1.3 !important; }
    #content h5 { font-size: 16px !important; line-height: 1.3 !important; }

    #content ul,
    #content ol,
    #content p { font-size: 14px !important; line-height: 1.3 !important; }

    #content { padding-left: 0; padding-right: 0; padding-top: 20px!important; background: none!important; }
    #content .right { float: none; width: 100%; margin-left: 0; }
#content .right-top h2 {
	padding-left: 12px;
}
#content .right-top h2 br{
	display: none;
}
    #content .right .filler br { display: none; }
    #content .right .filler .bt { background: none; }
    #content .right .filler .bt ul li { background: none; padding-left:12px;}

    #content .right .filler .bt ul { font-size: 16px; }
    #content .top_left { float:none!important;width: 100%!important; padding: 20px; }
    #content .top_left h3 { font-size: 14px; }
    #content #home_quote { top: -30px; }
    #content #home_subtitle { top: 5.5%; }

    #content .science .right { width: 100%; }
    #content .science .right img { width: 100%; height: auto; }
    #content .science .rajaraam { width: 100%; margin: 0; padding: 20px; }

    #content .section_bottom .right { width: 100%; margin-bottom: 0; padding-bottom: 0; }
    #content .section_bottom .left { width: 100%; padding: 20px; }

    #gradient #content { padding-top: 0; }
    #gradient #content h4 { font-size: 18px !important; padding: 5px; }
    #content .welcome { padding-top: 70px; }

    .content-secondary { padding: 30% 10px 30px !important; }

    #content .accordians .toggle { font-size: 16px; }
    #content .accordians .toggle span.des { font-size: 14px; }
    #content .accordians .element p { padding-right: 10px; }

    #content .sidenav { float: none; width: 100%; }
    #content .main { float: none; width: 100%; margin: 0; padding: 0; }

    #content .grahas p { padding-top: 7px; padding-bottom: 7px; background-repeat: repeat-y; }

    #content .days .right { width: 100%; float: none; border: 0; display:none;}
    #content .days .right h4 { font-size: 16px !important; }

    .gradient:after { content: ''; line-height: 0; display: table; clear: both; }

    #content .chart p { width: 100%; }

    /* ------------------------------------------------------------ *\
        Form
    \* ------------------------------------------------------------ */
    
    #content form .row { text-align: left; }
    #content form .row label {
	float: none;
	width: 100%;
	display: block;
	text-align: left;
	font-size: 14px;
}

    form .row input[type=text],
    form .row select,
    form .row textarea { width: 100%; }

    /* ------------------------------------------------------------ *\
        Copyright
    \* ------------------------------------------------------------ */
    
    div#copyright:before { content: ''; background: #86bef7; width: 10px; height: 130px; display: inline-block; position: absolute; top: 0px; right: 14%; }
    div#copyright img { position: static; max-width: 100%; width: 70%; }
    div#copyright p { width: 100%; margin-left: 0; padding: 20px; }
	
    /* ------------------------------------------------------------ *\
        Sidenav tweak
    \* ------------------------------------------------------------ */
	
	div.sidenav  {
		overflow:hidden;
		margin-bottom:12px;
	}
	div.sidenav.calendar li {
		float:left;
		margin-bottom:12px!important;
		width:100px;
		padding:0;
	}
	#content .sidenav.principles ul li{
	padding-left: 15px!important;
	margin-bottom:14px;
	white-space:nowrap;
	float:left;
	margin-left:12px;
}
	#content .sidenav.principles ul li span{
	font: 21px MyriadProSemiBold, sans-serif!important;
	top: -5px;
}
}

@media(max-width: 550px){
    div#copyright:before { height: 100px; }

    #content #home_subtitle { top: 4%; }
}

@media(max-width: 475px){
    #masthead #title { width: 308px!important;top:24px!important;}
    #masthead #subtitle  { width: 302px!important; }
    #content #home_subtitle { top: 3.5%; }

#content .right .filler .bt ul a{
	display: block;
}
    div#copyright:before { height: 80px; }

    .photos img { width: 100% !important; float: none; }
    .photos img ~ img { margin-left: 0; margin-top: 10px; }

    .gradient .photo { float: none; width: 100%; text-align: center; margin: 0; }
    .gradient .photo img { margin: 0 auto 10px; }
}

@media(max-width: 400px){
    #masthead #title { width: 256px!important;top:26px!important;}
    #masthead #subtitle  { width: 250px!important;top:48px!important; }
    #content #home_subtitle { top: 2.5%; }
}
@media(max-width: 320px){
    #masthead #title { width: 200px!important;top:28px!important;}
    #masthead #subtitle  { width: 190px!important;top:46px!important; }
}