/* colours
css blue theme #21#96f3;
#00cca3

*/

@import url('https://fonts.googleapis.com/css?family=Roboto:400,500,700');

h1,h2,h3,h4,h5,h6 {font-family: "Roboto", sans-serif;}
html, body {font-family: "Roboto", sans-serif; font-size: 10.75pt;  }
hr {
height: .15em;
color: #3366CC;
background-color: #3366CC;
border: none;
}


.phat { font-weight: 700; }
.lessphat  { font-weight: 500; }

.img-circle {
                    /*border-radius: 50%;*/
                    display: block;
                    margin-left: auto;
                    margin-right: auto;
                    width: 100%
}

.headfoot {
	background-color:#3366CC;
	padding: 8px;
	}
	
.bgc {
	background-color:#3366CC;
	}
	
a {
    color              : #3366CC;
    text-decoration    : none;
    }


.lefttxt{
	background-color:#3366CC;
	text-align: center;
	color : #ffffff;
	margin-top : -12px;
	margin-bottom: 5px;
	font-size: 10.5pt;
	}

.face {
	margin: auto;
    max-width : 175px;
	padding  : 18px !important;

    }

.listStyle {
    color: #3366CC;

}

.listStyle span {
    color: #000000;
       vertical-align: middle;

}

.bt {
    color: #000000;
}

.lix{
    margin-top: 7px;
}
    /* 

ul {
	list-style-position: inside;
    vertical-align: middle;  
    padding-left:10px;
}
    
ul li {
  color: #000000; 
  list-style: none; 
    vertical-align: middle;
    line-height: normal;	
}

li {
	padding: 5px;
	  vertical-align: middle;
}


 ul li::before {
	color: #3366CC;

  content: "\2022"; 

  font-size: 1.5em; 
 
  padding-right: 10px; 
  
  vertical-align: middle;

}

*/

.padent{
	padding-left: 25px;
	padding-top: 1px;
	padding-bottom: -50px;
}


/* cols */

.blocks {
    box-sizing : border-box;
        padding                : 10px;

    }
.big-block {
    display                : flex;
    flex-direction         : row;
    padding                : 10px;
    justify-content: center;
    }


.left-column {
    overflow     : hidden;
    flex         : 1 0 0;
    position     : relative;
    }

.right-column {
    flex         : 2 0 0;
    position     : relative;
	max-width : 740px;
    }

@media (min-width : 0px) and (max-width : 650px) {

    .big-block {
        display    : block;
        }

    .left-column {
        width    : 100%;
        position : relative;

        
        }

    .right-column {
        width      : 100%;
        position   : relative;
        margin-top : -45px;
        }
    }

@media (min-width : 651px) {
        
    .left-column {
        width    : 100%;
        position : relative;
        border   : 0;
        max-width : 220px;
         min-width : 220px;
   
        }
    }