/* CSS Document 
# id
. class
: 
margin top right bottom left
*/

/* Division Styles # id . class */


div#buttons {margin-top: 20px;}

/* For file input button to be an image - see tell someone*/
.image-upload>input {
  display: none;
}

/* Footer */
#searchbutton {float:right ;background-color:#25aae2; color:#000000; margin:0; padding-left:10px; padding-right:5px; border:none;}

/* Sixthform Footer */
#searchbutton6 {float:right ;background-color:#25aae2; color:#000000; margin:0; 
padding-top:0; padding-bottom:0;padding-left:10px; padding-right:5px; border:none;}
#searchbutton6 img { margin:0; padding:0; border:none;}


/* Buttons */
.xbutton {border:1px solid #886d4f; padding:.2em; margin:1em .5em 0 0; text-decoration:none; color:#45698c; -webkit-appearance: none;}
.xbutton:hover {border:1px solid #886d4f; padding:.2em; margin:1em .5em 0 0; text-decoration:underline; color:#000000;-webkit-appearance: none; }
.button     {background-color:#da551d; color:#25aae2;
				  text-align:center; 
				  vertical-align:middle; height:28px;
                  border-radius: 15px 15px 15px 15px;
                  padding: 0em 1em; margin:0; -webkit-appearance: none;}
.button:hover {background-color:#25aae2; color:#da551d;  
				  text-align:center; 
				  vertical-align:middle; height:28px;
                  border-radius: 15px 15px 15px 15px;
                  padding:0 1em; margin:0; -webkit-appearance: none; }

.bigbutton     {background-color:#da551d; color:#25aae2;
				  text-align:center; width:calc(100% - 0em);
				  vertical-align:middle; height:28px;
                  border-radius: 15px 15px 15px 15px;
                  padding: 0 1em; margin:0; -webkit-appearance: none;}
.bigbutton:hover {background-color:#25aae2; color:#da551d;  
				  text-align:center; width:calc(100% - 0em);
				  vertical-align:middle; height:28px;
                  border-radius: 15px 15px 15px 15px;
                  padding:0 1em; margin:0; -webkit-appearance: none; }

.fatbutton     {background-color:#da551d; color:#25aae2;
				  text-align:center; width:calc(100% - 0em);
				  vertical-align:middle; height:70px;
                  border-radius: 15px 15px 15px 15px;
                  font-size:24px; 
                  padding: 1em 1em; margin:0; -webkit-appearance: none;}
.fatbutton:hover {background-color:#25aae2; color:#da551d;  
				  text-align:center; width:calc(100% - 0em);
				  vertical-align:middle; height:70px;
                  border-radius: 15px 15px 15px 15px;
			      font-size:24px; 
                  padding:1em 1em; margin:0; -webkit-appearance: none; }

.fakebutton     {background-color:#da551d; color:#25aae2;
				  text-align:center; width:calc(100% + 1em);
				  vertical-align:middle; height:28px;
                  border-radius: 15px 15px 15px 15px;
                  padding: 1px; margin:0; -webkit-appearance: none;}
.fakebutton:hover {background-color:#25aae2; color:#da551d;  
				  text-align:center; width:calc(100% + 1em);
				  vertical-align:middle; height:28px;
                  border-radius: 15px 15px 15px 15px;
                  padding:1px; margin:0; -webkit-appearance: none; }

.ffbutton     {background-color:#da551d; color:#25aae2;
				  text-align:center; width:calc(100% + 1em);
				  vertical-align:middle; height:28px;
                  border-radius: 15px 15px 15px 15px;
                  padding: 1px; margin:0; -webkit-appearance: none;}
.ffbutton:hover {background-color:#25aae2; color:#da551d;  
				  text-align:center; width:calc(100% + 1em);
				  vertical-align:middle; height:28px;
                  border-radius: 15px 15px 15px 15px;
                  padding:1px; margin:0; -webkit-appearance: none; }

.ffbutton img   {background-color:#da551d; color:#25aae2;
				  text-align:center; width:calc(90% - 0em);
				  vertical-align:middle; height:30px;
                  border-radius: 15px 15px 15px 15px;
                  padding: 0; margin:0 8px 0 8px; -webkit-appearance: none;}
                  
.ffbutton:hover img {background-color:#25aae2; color:#da551d;  
				  text-align:center; width:calc(90% - 0em);
				  vertical-align:middle; height:30px;
                  border-radius: 15px 15px 15px 15px;
                  padding:0; margin:0 8px 0 8px; -webkit-appearance: none; }

.next {align: left; border:0;  padding:.4em; margin:.4em;   color:#000000; }
.next:hover {border:0; padding:.4em; margin:.4em;   color:#f2991f;}
.nextOut {align: left; border:0;  padding:.4em; margin:.4em;   color: #949b9a;}

/* End */.clear {clear:both; color:#000000; margin:0; padding:0; border:0; height:auto; width:100%;}

        .comment-box { margin-bottom: 15px; padding: 10px; border: 1px solid #ccc; }
        .comment-form { margin-top: 20px; }
        .message { margin-top: 10px; color: green; }
        .error { color: red; }



.iconleft {
	float:left;
	width:80%;
	margin-top:-30px;
	margin-right:10px;
}
img.border {border-style:solid; border-width:thin; border-color:#000000; padding:.2em .2em .2em .2em; margin:0 0 20px 20px;}
img.noborder {border:none;}

img.headingicon { border:none; margin-right:20px;
	max-height:50px; 
	max-width:50px; 
	object-fit: fill; 
}

img.linkicon { border:none; margin-right:20px;
	max-height:40px; 
	max-width:40px; 
	object-fit: fill; 
}


img.texticon { border:none; margin-right:5px;
	max-height:20px; 
	max-width:20px; 
	object-fit: fill; 
}

div.headingicon {float: left;  
	max-height:50px; 
	max-width:50px; 
    width: auto;
    height: auto;
	margin-left: 30px; 
	margin-right: 30px; 
}

img.headingiconright {float: right; border:none; 
	max-height:50px; 
	max-width:50px; 
    width: auto;
    height: auto;
margin-left: 50px; }
/*!

=========================================================
* Coming Sssoon Page - v1.3.2
=========================================================

* Product Page: https://www.creative-tim.com/product/coming-sssoon-page
* Copyright 2017 Creative Tim (http://www.creative-tim.com)
* Licensed under MIT (https://github.com/creativetimofficial/coming-sssoon-page/blob/master/LICENSE.md)

=========================================================

* The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
*/

body{
        font-size: 16px;
}
canvas { background: white; border: 1px solid #ccc; }
input[type=range] { width: 40%; }

/*     General overwrite     */
a{
    font-weight: bold;
}
a:hover, a:focus {
    color: #ffff00;
    font-weight: bold;
}


a.white{
    color: #ffffff;
    font-size: 24px;
    font-weight: bold;
}
a.white:hover, a.white:focus {
    color: #ffff00;
    font-size: 24px;
    font-weight: bold;
}

a.black{
    color: #000000;
    font-size: 24px;
    font-weight: bold;
}
a.black:hover, a.black:focus {
    color: #0360ad;
    font-size: 24px;
    font-weight: bold;
}
a.bold{
    color: #000000;
    font-weight: bold;
}
a.bold:hover, a.black:focus {
    color: ;
    font-weight: bold;
}
/*
a:focus, a:active,
button::-moz-focus-inner,
input[type="reset"]::-moz-focus-inner,
input[type="button"]::-moz-focus-inner,
input[type="submit"]::-moz-focus-inner,
select::-moz-focus-inner,
input[type="file"] > input[type="button"]::-moz-focus-inner {
    outline : 0;
}
button {background-color:$colourBlue;}
*/

h1         {font-size:26px; color:; margin:.5em 0 0 0; padding:10px; border:0;  }
h1.blue    {font-size:32px; font-weight:bold; color:#0000ff; margin:0; margin-top:.5em; padding:10px;}
h1.gold    {font-size:32px; font-weight:bold; color:#da551d; margin:0; margin-top:.5em; padding:10px;}
/*           Typography          */

.quote {font-size:24px !important; margin-left:50px; margin-right:50px; font:italic;} 

.wiki {margin-left:50px; margin-right:50px; font:italic;} 

p{
    font-size: 16px;
    line-height: 1.6180em;
}

ul {
/*
    display: block;
    list-style-type: disc;
    margin-block-start: 1em;
    margin-block-end: 1em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
	padding-inline-start: 40px;
	unicode-bidi: isolate;
*/
    padding-inline-start: 20px;
}
/*  */
.twothirdscolumn {width:66%;  vertical-align:top; margin:0;}
.halfcolumn {width:50%; vertical-align:top; margin:0;float:left;}
.thirdcolumn {width:33%; vertical-align:top; margin:0;float:left;}
.quartercolumn {width:25%; vertical-align:top; float:left;}
.autocolumn { width:auto;  vertical-align:top; margin:0;}
.left{clear:left; float:right; margin-right:auto;}
.right{float:right; margin-left:auto; margin-right:0;}
.centre{float:both; margin-left:auto; margin-right:auto;}
.center{float:both; margin-left:auto; margin-right:auto;}
.leftoftext { padding-right: 10px; }
.rightoftext { padding-left: 10px; }
.centreoftext { padding-left: 10px; padding-right: 10px; }

textarea.comment {width:100%;  vertical-align:top; margin:0;
}

div.mainbody { width:100%; 	position: relative; clear:both;  padding-left:50px; padding-right:50px;
}
div.red   { color:#ff0000; }
div.green { color:; }
div.blue  { color:#0000ff; }
/*    background-image: url('https://www.asif.vision/resources/images/JuliaSetLotusMandalaOfZodiac.jpg'); */

p.error {color:#ff0000 !important; }
p.line { text-align:right; margin-top:34px; margin-bottom:20px;}
input.line { font-size:20px; box-sizing:border-box; margin-top:12px; margin-bottom:0px; }
select.line { font-size:20px; box-sizing:border-box; margin-top:12px; margin-bottom:0px; }
textarea.line { font-size:20px; box-sizing:border-box; margin-top:12px; margin-bottom:0px; }
button.line:hover {background-color:#bfd630; }
 
.bigbutton { font-size:24px; background-color:; }
.bigbutton:hover { font-size:24px; }


.main{
    background-image: url('https://www.asif.vision/resources/images/Mandala.png');
    background-position: center center;
    background-size: cover;
    height: auto;
    left: 0;
    min-height: 100%;
    min-width: 100%;
    position: absolute;
    top: 0;
    width: auto;
}
.cover{
    position: fixed;
    opacity: 1;
    background-color: rgba(0,0,0,.1);
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 1;
}
.cover.black{
    background-color: rgba(0,0,0,.6);
}

.logo-container .logo{
    overflow: hidden;
    border-radius: 50%;
    border: 1px solid #333333;
    width: 60px;
    float: left;
}

.main .logo{
    color: #FFFFFF;
    font-size: 56px;
    font-weight: 300;
    position: relative;
    text-align: center;
    text-shadow: 0 0 10px rgba(0, 0, 0, 0.33);
    margin-top: 150px;
    z-index: 3;
}
.main .logo.cursive{
    font-family: 'Grand Hotel';
    font-size: 82px;
    
}
.main .content{
    position: relative;
    z-index: 4;
}
.main .motto{
    min-height: 140px;
}
.main .motto, .main .subscribe .info-text{
    font-size: 28px;
    color: #FFFFFF;
    text-shadow: 0 1px 4px rgba(0, 0, 0, 0.33);
    text-align: center;
    margin-top: 50px;
    
}
.main .subscribe .info-text{
    font-size: 18px;
    margin-bottom: 30px;
}

.footer{
    position: relative;
    bottom: 20px;
    right: 0;
    width: 100%;
    color: #AAAAAA;
    z-index: 4;
    text-align: right;
    margin-top: 50px;
}
.footer a{
    color: #FFFFFF;
}

@media (min-width:991px){
    .footer{
        position: fixed;
        bottom: 20px;
    }
}